ID-Attribut

Damit Sie Ihr Shape animieren können, müssen Sie alle Elemente, welche sich verändern sollen, mit dem id-Attribut eindeutig identifizieren. Alle Elemente, die mit einer gültigen ID gekennzeichnet sind, werden bei Aktionen in der Auswahlliste Element aufgelistet, die dafür verwendet werden kann, um das Aussehen des Elements dynamisch zur Laufzeit zu ändern.

Achten Sie darauf, dass eine ID eindeutig sein muss und nur Buchstaben und Zahlen enthalten darf.

Beispiel

<svg version="1.1" id="AvelonVentilationFlaps" x="0px" y="0px"
     width="39px" height="79px">
    <rect id="OutOfService" x="-2" y="-2" fill="#FFCC00"
          stroke="#EEBB00" width="44" height="84" />
    <rect x="0" y="0" fill="#555555" width="39" height="79" />
    <rect x="1" y="1" fill="url(#VentilationBox)"
          width="37" height="77" />
    <rect id="Alarm" x="1" y="1" fill="url(#VentilationBoxAlarm)"
          width="37" height="77" />
    <g id="TopFlap">
        <circle fill="#555555" stroke="#555555"
                cx="0" cy="0" r="1.5" />
        <line fill="none" stroke="#555555"
                x1="0" y1="-19" x2="0" y2="19" />
    </g>
    <g id="BottomFlap">
        <circle fill="#555555" stroke="#555555"
                cx="0" cy="0" r="1.5" />
        <line fill="none" stroke="#555555"
              x1="0" y1="-19" x2="0" y2="19" />
    </g>
</svg>