Marker Miscellanea

If you want the same marker at the beginning, middle, and end of a path, you don’t need to specify all of the marker-start, marker-mid, and marker-end properties. Just use the marker property and have it reference the marker you want. Thus, if we wanted all the vertices to have a circular marker, as shown in Figure 6-20, we’d write the SVG in Example 6-9.

<defs>
    <marker id="mCircle" markerWidth="10" markerHeight="10" 
        refX="5" refY="5">
        <circle cx="5" cy="5" r="4" style="fill: none; stroke: black;"/>
    </marker>
</defs>

<path d="M 10 20 100 20 A 20 30 0 0 1 120 50 L 120 110"
    style="marker: url(#mCircle); fill: none; stroke: black;"/>