clearRect non cancella la tela quando si tracciano linee verticali

Question

Ho colpito un caso di bordo strano creando qualcosa con la tela al lavoro. clearRect non cancella la tela quando disegna linee verticali che vanno dall'alto verso il basso della tela. Durante il rendering di altre cose, clearRect funziona correttamente.

Non sono sicuro se mi manca qualcosa di ovvio, se si tratta di un comportamento intenzionale o di un bug del browser (improbabile dal momento che il comportamento è identico in chrome, safari, firefox e opera su mac). Se si tratta di un comportamento intenzionale, qualcuno conosce la logica dietro di esso e/o può forse indicare qualche documentazione?

Ho fatto un piccolo script che mostra il comportamento chiaramente, solo la combinazione clearRect linee verticali/non cancella la tela: http://jsfiddle.net/kZj6F/

Grazie!

Answer 1

Il problema riguarda uno beginPath mancante che causa l'aggiunta di righe successive allo stesso percorso che era stroke che disegna tutte le righe.

Se si passa ai punti e si torna alle linee con l'opzione clearRect, è possibile visualizzare l'ultimo arc aggiunto al tracciato. Basta aggiungere una chiamata ctx.beginPath(); prima del ctx.moveTo(randomX + 0.5, 0); ctx.lineTo(randomX + 0.5, canvas.height); e il problema è risolto.

È possibile controllare http://jsfiddle.net/kZj6F/1/ per vederlo funzionare.

Bwt lo farà anche con altre forme se sono stati aggiunti al percorso e il percorso non è stato cancellato.