These forums are currently read-only due to receiving more spam than actual discussion. Sorry.

It is currently Sat Dec 02, 2017 4:04 pm Advanced search

Arc in HTML5 not working properly.

Here you can discuss things related to HTML and the Web in general that do not fit in to other categories.

Arc in HTML5 not working properly.

Postby rao.aaguri » Wed Aug 11, 2010 6:47 am

Having problem with Arcs. I have attached the sample code that i wrote. I can see lines in between arcs. Help me to make it fine.
Code: Select all
<html>
   <head>
      <script>
         function drawLineOn(){
            var cavObj = document.getElementById("canvasBox");
            if(cavObj.getContext){

               var contextObj = cavObj.getContext('2d');
               contextObj.beginPath();
               contextObj.arc(200,150,50,0,Math.PI*2,true);
               contextObj.arc(200,150,35,0,Math.PI,false)
               contextObj.arc(185,140,5,0,Math.PI*2,true)
               contextObj.arc(215,140,5,0,Math.PI*2,true)
               contextObj.stroke();
            }
         }
      </script>
   </head>
   <body onload="drawLineOn();">
      <p> HTML5 Sample Smile</p>
      <canvas id="canvasBox" width="400px" height="300px" style="border:1px solid red"></canvas>
   </body>
</html>
rao.aaguri
<h6>
 
Posts: 1
Joined: Wed Aug 11, 2010 6:14 am
Location: Hyderabad

Re: Arc in HTML5 not working properly.

Postby zcorpan » Thu Sep 20, 2012 8:42 am

Use moveTo().
Code: Select all
         function drawLineOn(){
            var cavObj = document.getElementById("canvasBox");
            if(cavObj.getContext){

               var contextObj = cavObj.getContext('2d');
               contextObj.beginPath();
               contextObj.arc(200,150,50,0,Math.PI*2,true);
               contextObj.moveTo(235,150);
               contextObj.arc(200,150,35,0,Math.PI,false);
               contextObj.moveTo(190,140);
               contextObj.arc(185,140,5,0,Math.PI*2,true);
               contextObj.moveTo(220,140);
               contextObj.arc(215,140,5,0,Math.PI*2,true);
               contextObj.stroke();
            }
         }
zcorpan
<article>
 
Posts: 807
Joined: Tue Feb 06, 2007 8:29 pm
Location: Sweden


Return to General Discussion

Who is online

Users browsing this forum: No registered users and 1 guest