+ 1

Why couldn't I draw a circle?

<html> <head></head> <body> <canvas id="canvas1" width="1000" height="1000"> </canvas> <script> var canvas=document.getElementById("canvas1"); var ctx=canvas.getContext("2d"); ctx.fillStyle ="rgba(0, 200, 0, 1)"; ctx.fillRect (36, 10, 22, 22); var ctx.beginpath(); ctx.arc(35,35, 20, 10,10); ctx.stroke();

html html5 canvas

4th Nov 2017, 11:10 AM

Abdussamad Nasir

4 Answers

+ 6

Assuming you correctly close all your tags in your real code, and you delete the 'var' keyword alone in its line, the problem is that you provide same value for starting and ending angle values: <html> <head></head> <body> <canvas id="canvas1" width="1000" height="1000"> </canvas> <script> var canvas=document.getElementById("canvas1"); var ctx=canvas.getContext("2d"); ctx.fillStyle ="rgba(0, 200, 0, 1)"; ctx.fillRect (36, 10, 22, 22); // var ctx.beginPath(); // ctx.arc(35,35, 20, 10,10); ctx.arc(35,35,20, 0,2*Math.PI); ctx.stroke(); </script> </body> </html>

4th Nov 2017, 11:40 AM

visph