<h2>SVG arc path</h2>
<h3>Drag the green and blue dots</h3>

<div id="controls">
    <label>
        <input type="radio" name="arc-mode" id="draw-circle" checked >
        Circle
    </label>
    <label>
        <input type="radio" name="arc-mode" disabled >
        Ellipse //TODO
    </label>
</div>
<svg width="500" height="500" >
    <!-- circle class="center" r="5" /-->
    <path id="arc" />
    <path id="arc-alternate" />
    <line class="tangent" />
    <line class="tangent" />
    <circle id="start" class="dot" r="10" cx="200" cy="150" />
    <circle id="help" class="dot" r="10" cx="450" cy="300" />
    <circle id="end" class="dot" r="10" cx="250" cy="400" />
</svg>

<code></code>