blob: ca5468c351ffaae501e8c44a460d84748d4595d7 [file] [log] [blame]
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg width="600" height="600" style="fill:none">
<defs>
<marker id="Triangle"
viewBox="0 0 10 10" refX="5" refY="5"
markerWidth="4" markerHeight="4"
orient="auto">
<path id = "mypath" d="M 0 0 L 10 5 L 0 10 z" style="fill:black; stroke:red; stroke-width:2;
stroke-dasharray:none; marker:url(#Circle);"/>
</marker>
<marker id="Circle"
viewBox="0 0 10 10" refX="5" refY="5"
markerWidth="5" markerHeight="5"
orient="auto">
<circle cx="5" cy="5" r="5" style="fill:none; stroke-width:2; stroke:blue; stroke-dasharray:none"/>
</marker>
<marker id="Square" viewBox="0 0 20 20" refX="10" refY="10"
markerWidth="3" markerHeight="3"
orient="auto">
<rect x ="0" y="0" width="20" height="20" style="fill:teal; stroke:none"/>
</marker>
<linearGradient id="mygradient">
<stop offset="0" stop-color="red"/>
<stop offset="0.8" stop-color="blue"/>
</linearGradient>
</defs>
<title> Simple shapes </title>
<rect x = "120" y="120" width="100" height="150" style="fill:blue; stroke:black; stroke-width:4; stroke-linejoin:round" />
<circle cx="300" cy="400" r="50" style="fill : url(#mygradient); stroke:navy; stroke-width:2; stroke-dasharray: 5 2 10; stroke-dashoffset:15"/>
<ellipse cx="450" cy="200" rx="50" ry="100" style="fill:#bc1203; stroke:none"/>
<polyline points="100 100 150 100 150 150 200 150 200 200 250 200 250 250 300 250 300 300 350 300 350 350
400 350 400 400 450 400 450 450 500 450 500 500"
style="stroke:lime; stroke-width: 3; stroke-linejoin: round; stroke-linecap:round; stroke-opacity:0.5;
marker-start:url(#Circle);marker-mid:url(#Square);marker-end:url(#Triangle)" />
<polygon points="50 100 100 50 500 50 550 100 550 500 500 550 100 550 50 500"
style="stroke:aqua; stroke-width: 15; stroke-linejoin:round" />
<line x1="100" x2="500" y1="500" y2="100"
style="stroke:rgb(255,255,0); stroke-width:8; stroke-dasharray: 5 5 10 5 15 5 10 5;
marker-start:url(#Circle);marker-end:url(#Triangle)" />
</svg>