Html5 Il metodo Canvas isPointInPath determina solo l'ultimo oggetto

Question

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

Se si scrive senza beginPath tutti gli oggetti rilevati. Come identificare gli oggetti sulla tela o omettere beginPath?

Answer 1

Se si desidera utilizzare tale funzione, è necessario ricostruire il percorso ogni volta che si desidera eseguire il test (è sufficiente non chiamare fill o stroke).

Quello che faccio normalmente, invece, è utilizzare la mia funzione di test point-in-polygon o la mia struttura di dati spaziali se ci sono molti oggetti e la velocità è importante.

Si noti che una tela è solo una bitmap e non memorizza i comandi che si usano per disegnarla. Questo è il motivo per cui non può eseguire il controllo dopo aver disegnato una forma e puoi testare solo il percorso corrente.

Dopo aver chiamato beginPath la geometria del percorso precedente viene eliminata e quali sono i pixel interessati solo se si chiama fill o stroke.

può essere per il vostro caso può essere utile per controllare il colore del pixel tele ...

Answer 2

Ho appena letto che una nuova aggiunta alla specifica tela è Path) Oggetti (. Presumibilmente questi potrebbero essere memorizzati e successivamente testati e/o riprodotti. Potrebbe essere utile Se ho capito le specifiche correttamente.

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