使用画布确定形状的创建

Question

I want to test with JavaScript that a canvas shape was created.

For example: I'm creating a circle:

context.beginPath();
context.fillStyle = this.color;
context.arc(this.x, this.y, this.radius, 0, 2 * Math.PI, false);
context.fill();
context.stroke();
context.closePath();

In this moment circle suppose to be created. I'm thinking to test it like this:

context.isPointInPath(this.x+1,this.y+1) == true;

But I don't find this very elegant. Anyone has a better idea?

Answer 1

x ² + y ² < r ²

r - radius

This is the set of points for a circle.

All the values of x and y that meets the formula inequality are inside the circle.

So check for a point with values (-r< x <r,-r< y <r) to be true.

And check for points (r+1,r+1) (r+1,-r-1) (-r-1,r+1) (-r-1,-r-1) to be false