We developed a diagramming component using SVG and used markers for links[line] to direct the connection b/w nodes. The marker is working fine when updating the line’s X and Y position in IE9 but it is now not working with IE.
We are frustrated with the IE10 browser and are using updated IE10 version 10.0.9200.16384.
Here is the simple code which reproduces the issue.
<body><svg xmlns="http://www.w3.org/2000/svg" width="100%" height="50%"><defs><marker id="Triangle" viewBox="0 0 20 20" refX="0" refY="10" markerUnits="strokeWidth" markerWidth="8" markerHeight="6" orient="auto"><path d="M 0 0 L 20 10 L 0 20 z"/></marker><marker id="Circle" viewBox="0 0 10 10" refX="4" refY="10" markerUnits="strokeWidth" markerWidth="6" markerHeight="6" orient="auto"><circle cx="5" cy="5" r="3" fill="black"/></marker><marker id="Rect" viewBox="0 0 20 20" refX="0" refY="10" markerUnits="strokeWidth" markerWidth="10" markerHeight="10" orient="auto"><rect width="10" height="10" fill="grey"/></marker></defs><line id="line1" x1="10" y1="10" x2="100" y2="10" stroke="black" stroke-width="1" marker-end="url(#Triangle)" marker-start="url(#Circle)"/> </svg><table><tr><td>
line x1</td><td><input type="text" id="txtlinex" style="width:50px" value="10" /></td></tr><tr><td>
line y1</td><td><input type="text" id="txtliney" style="width:50px" value="10" /></td></tr></table><input type="button" id="button1" value="Move line offset " /><script type="text/javascript">
$("#button1").click(function () {
$("#line1")[0].x1.baseVal.value = $("#txtlinex")[0].value;
$("#line1")[0].y1.baseVal.value = $("#txtliney")[0].value;
});</script> </body>Please looking into this issue and fix this asap.
Please get back to me if any queries.
Regards,
Senthilkumar.M