How to remove the radius lines in html canvas when drawing a circle with arc in javascript?
<p>This is my html code to draw a smiley face. After i tried it out, i saw that there are some extra lines. there are lines in the eyes in the place of the radius. and for the mouth too.
How can i remove those three radius lines?</p>

<p><a href="http://i.stack.imgur.com/pMTJx.png" rel="nofollow">CLICK HERE FOR OUTPUT IMAGE</a></p>

<p>
    </p>

<pre><code>&lt;/head&gt;
&lt;body onclick="line();"&gt;
    &lt;canvas id="canvas" width="1000" height="500"&gt;&lt;/canvas&gt;
    &lt;script&gt;
        function line()
        {
            var canvas = document.getElementById('canvas');
            if(canvas.getContext)
                {
                    var lines = canvas.getContext('2d');
                    lines.beginPath();
                    lines.arc(275,275,150,0,Math.PI*2,true);
                    lines.moveTo(280, 275);
                    lines.arc(275, 275, 100, 0, Math.PI, false);
                    lines.moveTo(210,220);
                    lines.arc(210, 220, 20, 0, Math.PI*2, true);
                    lines.moveTo(350, 220);
                    lines.arc(350, 220, 20, 0, Math.PI*2, true);
                    lines.stroke();                
                }
        }
    &lt;/script&gt;
&lt;/body&gt;
</code></pre>

<p></p>