Html5 Método de lienzo isPointInPath determina solo el último objeto

Question

Un ejemplo 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); 

Si escribe sin beginPath todos los objetos detectados. ¿Cómo identificar objetos en el lienzo u omitir beginPath?

Answer 1

Si desea usar esa función, necesita reconstruir la ruta cada vez que quiera hacer la prueba (simplemente no llame al fill o al stroke).

Lo que hago normalmente es utilizar mi propia función de prueba de punto en un polígono o mi propia estructura de datos espaciales si hay muchos objetos y la velocidad es importante.

Tenga en cuenta que un lienzo es solo un mapa de bits y no almacena los comandos que utiliza para dibujar en él. Es por eso que no puede hacer el control después de dibujar una forma y puede probar solo la ruta actual.

Una vez que llame al beginPath, la geometría de ruta anterior se descarta y lo que tiene son solo los píxeles afectados si llamó a fill o stroke.

puede ser para su caso puede tener sentido para comprobar el color del píxel lienzo ...

Answer 2

acabo de leer que una nueva adición a la especificación de la lona es Path objetos(). Presumiblemente, estos podrían ser almacenados y posteriormente probados y/o reproducidos. Podría ser útil. Si he entendido la especificación correctamente.

http://www.whatwg.org/specs/web-apps/current-work/multipage/the-canvas-element.html#path-objects