1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:html="http://www.w3.org/1999/xhtml" width="500" height="500">
<html:link rel="help" href="https://www.w3.org/TR/2016/CR-SVG2-20160915/painting.html#OrientAttribute"/>
<html:link rel="match" href="marker-orient-001-ref.svg"/>
<html:meta name="assert" content="Ensure orientation of auto and auto-start-reverse markers is correct."/>
<defs>
<marker id="arrow" orient="auto-start-reverse" markerUnits="userSpaceOnUse" style="overflow:visible">
<path d="M25,0 L 0,-25 L0,25 z" fill="green"/>
</marker>
</defs>
<!-- Test path, with markers -->
<path d="M 40,40 l140,140 240,240" marker-start="url(#arrow)" marker-mid="url(#arrow)" marker-end="url(#arrow)" stroke="black" stroke-width="2"/>
<path d="M 40,400 l100,-100 100,-100" marker-start="url(#arrow)" marker-mid="url(#arrow)" marker-end="url(#arrow)" stroke="black" stroke-width="2"/>
<path d="M 160,40 c40,0 40,0 40,40" marker-start="url(#arrow)" marker-mid="url(#arrow)" marker-end="url(#arrow)" stroke="black" fill="none" stroke-width="2"/>
<path d="M 260,140 a 100,100 0 1 1 100,100" marker-start="url(#arrow)" marker-mid="url(#arrow)" marker-end="url(#arrow)" stroke="black" fill="none" stroke-width="2"/>
<path d="M 340,100 h50 v50 h-50 z" marker-start="url(#arrow)" marker-mid="url(#arrow)" marker-end="url(#arrow)" stroke="black" fill="none" stroke-width="2"/>
</svg>
|