Beim Verschieben einer SVG Linie mit Marker im Internet Explorer 10 wird der Marker nicht mit verschoben: Unterschied zwischen den Versionen

Aktuelle Version vom 4. September 2013, 08:47 Uhr

Problem[Bearbeiten]

Über JavaScript wird eine SVG Linie mit Marker per Änderung der Attribute für x1 und y1 oder x2 und y2 verschoben. In allen Browsern funktioniert es, nur im Internet Explorer 10 wird der definierte Marker der Linie (marker-start, marker-mid oder marker-end) jedoch nicht mit verschoben und bleibt auf der ursprünglichen Stelle stehen.

Lösung[Bearbeiten]

Dies ist ein Bug des Internet Explorer 10. Indem die Linie einfach erneut vor sich selbst eingefügt bzw. verschoben wird, kann dieser Bug umgangen werden:

if (navigator.appVersion.indexOf("MSIE 10") != -1)
{
    svgNode.parentNode.insertBefore(svgNode, svgNode);
}

Die Variable svgNode ist das Node Objekt der Linie.

Beispiel[Bearbeiten]

Hier das Beispiel ohne Bugfix: jsFiddle

Und hier das Beispiel mit Bugfix: jsFiddle

Bewertung[Bearbeiten]