Home/ Questions/Q 6755643
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T13:25:39+00:00

An example here . var context=document.getElementById(canvas).getContext(2d); //Red Box context.beginPath(); context.fillStyle=Red; context.rect(10,10,50,50); context.fill(); //Pink circle

  • 0

An example here.

var context=document.getElementById("canvas").getContext("2d");

//Red Box
context.beginPath();
context.fillStyle="Red";
context.rect(10,10,50,50);
context.fill();

//Pink circle
context.beginPath();
context.lineWidth="3";
context.fillStyle="Pink";
context.arc(250,250,50,0,Math.PI*2,false);
context.fill();
context.stroke();

context.font="1.2em Verdana";
context.fillStyle="Black";
context.fillText(context.isPointInPath(35,35),35,35);
context.fillText(context.isPointInPath(250,250),250,250);

If you write without beginPath all objects detected.
How to identify objects on the canvas or to omit beginPath?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If you want to use that function you need to rebuild the path every time you want to do the test (just don’t call fill or stroke).

    What I do normally instead is using my own point-in-polygon test function or my own spatial data structure if there are a lot of objects and speed is important.

    Note that a canvas is just a bitmap and it doesn’t store the commands you use to draw on it. That is why it cannot do the check after drawing a shape and you can test only the current path.

    Once you call beginPath the previous path geometry is discarded and what you have are only the affected pixels if you called fill or stroke.

    May be for your case it may make sense to check the color of the canvas pixel…

    • 0