34 lines
1.2 KiB
XML
34 lines
1.2 KiB
XML
<?xml version="1.0" standalone="no"?>
|
|
<svg width="12cm" height="6cm" viewBox="0 0 1200 600"
|
|
xmlns="http://www.w3.org/2000/svg" version="1.1">
|
|
<title>Example quad01 - quadratic Bézier commands in path data</title>
|
|
<desc>Picture showing a "Q" a "T" command,
|
|
along with annotations showing the control points
|
|
and end points</desc>
|
|
<rect x="1" y="1" width="1198" height="598"
|
|
fill="none" stroke="blue" stroke-width="1" />
|
|
|
|
<path d="M200,300 Q400,50 600,300 T1000,300"
|
|
fill="none" stroke="red" stroke-width="5" />
|
|
|
|
<path d="M200,310 q200,-250 400,0 t400,0"
|
|
fill="none" stroke="blue" stroke-width="5" />
|
|
<!-- End points -->
|
|
<g fill="black" >
|
|
<circle cx="200" cy="300" r="10"/>
|
|
<circle cx="600" cy="300" r="10"/>
|
|
<circle cx="1000" cy="300" r="10"/>
|
|
</g>
|
|
<!-- Control points and lines from end points to control points -->
|
|
<g fill="#888888" >
|
|
<circle cx="400" cy="50" r="10"/>
|
|
<circle cx="800" cy="550" r="10"/>
|
|
</g>
|
|
<path d="M200,300 L400,50 L600,300
|
|
L800,550 L1000,300"
|
|
fill="none" stroke="#888888" stroke-width="2" />
|
|
<path
|
|
id="heart"
|
|
d="M10,30 A20,20,0,0,1,50,30 A20,20,0,0,1,90,30 Q90,60,50,90 Q10,60,10,30 Z" />
|
|
|
|
</svg> |