1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
<!--
Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/
-->
<svg xmlns="http://www.w3.org/2000/svg">
<defs>
<marker id="redTriangle"
refX="0" refY="12" markerUnits="userSpaceOnUse"
markerWidth="24" markerHeight="24" orient="auto">
<path fill="red" d="M 0 0 L 24 12 L 0 24 z" />
</marker>
<marker id="limeTriangle"
refX="0" refY="12" markerUnits="userSpaceOnUse"
markerWidth="24" markerHeight="24" orient="auto" overflow="visible">
<path fill="lime" stroke-width="3" stroke="lime" d="M 0 0 L 24 12 L 0 24 z" />
</marker>
<marker id="reverseLimeTriangle"
refX="0" refY="12" markerUnits="userSpaceOnUse"
markerWidth="24" markerHeight="24" orient="auto" overflow="visible">
<path transform="rotate(180, 0, 12)" fill="lime" stroke-width="3" stroke="lime" d="M 0 0 L 24 12 L 0 24 z" />
</marker>
</defs>
<rect width="100%" height="100%" fill="lime"/>
<!-- Control point vectors are zero -->
<path d="M 50,125 C 50,125, 100,25, 100,25" stroke-width="10" stroke="red"
marker-end="url(#redTriangle)" />
<path d="M 150,125 C 200,25, 200,25, 200,25" stroke-width="10" stroke="red"
marker-end="url(#redTriangle)" />
<!-- Non-degenerate covering -->
<path d="M 50,125 L 100,25" stroke-width="13" stroke="lime"
marker-end="url(#limeTriangle)" marker-start="url(#reverseLimeTriangle)" />
<path d="M 150,125 L 200,25" stroke-width="13" stroke="lime"
marker-end="url(#limeTriangle)" marker-start="url(#reverseLimeTriangle)" />
</svg>
|
