user1934428
user1934428

Reputation: 22356

HTML5 Canvas: Why is my circle not drawn?

Below is a sketch of my code. I want to draw a circle on top of an image. The image is shown, but the circle isn't.

ctx=can.getContext('2d');
backpic=document.getElementById('canpic');
ctx.drawImage(backpic,0,0);
pos=[100,100];
ctx.save();
ctx.beginPath();
ctx.lineWidth=2;
ctx.strokeStyle="green";
ctx.arc(pos[0],pos[1],40,0,2 * Math.PI,false);
ctx.stroke();
ctx.restore();

What am I doing wrong?

Upvotes: 0

Views: 76

Answers (1)

Hans
Hans

Reputation: 2800

Your circle works on fiddle.

can = document.getElementById("can");
ctx=can.getContext('2d');
pos=[100,100];
ctx.save();
ctx.beginPath();
ctx.lineWidth=2;
ctx.strokeStyle="green";
ctx.arc(pos[0],pos[1],40,0,2 * Math.PI,false);
ctx.stroke();
ctx.restore();

http://jsfiddle.net/8TNdZ/

Upvotes: 1

Related Questions