| <svg width="800" height="600" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> |
| <defs> |
| <marker id="markerStart" viewBox="0 0 10 10" markerWidth="1" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> |
| <rect width="10" height="10" fill="red" stroke="none"/> |
| </marker> |
| <marker id="markerMiddle" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> |
| <circle cx="5" cy="5" r="5" fill="green" stroke="none"/> |
| </marker> |
| <marker id="markerEnd" viewBox="0 0 10 10" markerWidth="2" markerHeight="2" refX="5" refY="5" markerUnits="strokeWidth"> |
| <path d="M 5 0 L 10 10 L 0 10 Z" fill="blue" stroke="none"/> |
| </marker> |
| </defs> |
| |
| |
| <g onclick="mouseHandler()"> |
| <path fill="none" stroke="black" stroke-width="8" marker-start="url(#markerStart)" marker-mid="url(#markerMiddle)" marker-end="url(#markerEnd)" d="M 130 135 L 180 135 L 180 185"/> |
| </g> |
| |
| <script> |
| function mouseHandler(evt) |
| { |
| var marker = document.getElementById("markerStart"); |
| marker.setAttribute("markerWidth", "2"); |
| } |
| |
| if (window.eventSender) { |
| eventSender.mouseMoveTo(150, 135); |
| eventSender.mouseDown(); |
| eventSender.mouseUp(); |
| } |
| </script> |
| |
| </svg> |
