| 1 | <svg width="453.5" height="75.6" style="text-anchor:middle;" |
| 2 | xmlns="http://www.w3.org/2000/svg"> |
| 3 | <desc>Example linecap - demonstrates three stroke-linecap values</desc> |
| 4 | <rect x="1" y="1" width="451" height="73" style="fill:none;stroke:blue;" /> |
| 5 | <g transform="translate(75.6,28.3)" > |
| 6 | <line x1="-47.2" x2="47.2" y1="0" y2="0" style="stroke:black;stroke-width:26.4;stroke-linecap:butt;"/> |
| 7 | <line x1="-47.2" x2="47.2" y1="0" y2="0" style="stroke:#ffcccc;stroke-width:1.8;"/> |
| 8 | <circle id="circle1" cx="-47.2" cy="0" r="3" style="fill:#ffcccc;stroke:none;"/> |
| 9 | <circle id="circle2" cx="47.2" cy="0" r="3" style="fill:#ffcccc;stroke:none;"/> |
| 10 | <text y="34" >'butt' cap</text> |
| 11 | </g> |
| 12 | <g transform="translate(226.8,28.3)"> |
| 13 | <line x1="-47.2" x2="47.2" y1="0" y2="0" style="fill:none; stroke:black;stroke-width:26.4;stroke-linecap:round;"/> |
| 14 | <line x1="-47.2" x2="47.2" y1="0" y2="0" style="fill:none; stroke:#ffcccc;stroke-width:1.8;"/> |
| 15 | <circle id="circle1" cx="-47.2" cy="0" r="3" style="fill:#ffcccc;stroke:none;"/> |
| 16 | <circle id="circle2" cx="47.2" cy="0" r="3" style="fill:#ffcccc;stroke:none;"/> |
| 17 | <text y="34">'round' cap</text> |
| 18 | </g> |
| 19 | <g transform="translate(378,28.3)"> |
| 20 | <line x1="-47.2" x2="47.2" y1="0" y2="0" style="fill:none; stroke:black;stroke-width:26.4;stroke-linecap:square;"/> |
| 21 | <line x1="-47.2" x2="47.2" y1="0" y2="0" style="fill:none;stroke:#ffcccc;stroke-width:1.8;"/> |
| 22 | <circle id="circle1" cx="-47.2" cy="0" r="3" style="fill:#ffcccc;stroke:none;"/> |
| 23 | <circle id="circle2" cx="47.2" cy="0" r="3" style="fill:#ffcccc;stroke:none;"/> |
| 24 | <text y="34" >'square' cap</text> |
| 25 | </g> |
| 26 | </svg> |