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;"/>