línea clara en HTML5 Canvas

Question

¿Hay alguna manera de destrabar una línea? En mi lienzo tengo una línea con una opacidad de 0,5 y un ancho de 20 píxeles, digamos. Ahora quiero hacerlo más largo, significa dibujar otra línea desde la anterior. al hacer eso, los puntos coincidentes entre las líneas viejas y las nuevas se vuelven menos transparentes (porque ahora están hechas de dos líneas). , así que quiero utilizar la línea anterior y luego aplicar la nueva.

¿cómo puedo hacerlo?

gracias

Answer 1

Cómo dibujar en un lienzo está estrictamente definido por la API, pero la forma en que se hace en el software y/o hardware depende de los desarrolladores del navegador. Algunos de los navegadores usan aceleración de hardware y los otros están trabajando en él atm. (por ej., usando una memoria caché del procesador de software)

En gráficos de computadora cuando se dibuja algo, se dibuja en un búfer. Y cuando llamas lineTo y stroke el búfer se actualiza y toda la información que estaba en los píxeles subyacentes se pierde (o se pierde en parte si usas transparencia) y no hay forma de recuperarla deshaciendo (a menos que haya una implementación que contenga cargas) de dibujos antiguos, pero eso sería muy pesado para la memoria).

Así que para ser capaz de deshacer un accidente cerebrovascular podría ahorrar una gran cantidad de tiempo de CPU/GPU PERO whould en gran medida aumentar la memoria

Answer 2

supongo que la forma más fácil sería simplemente borrar todo el lienzo (usando clearRect) y acaba de sacar toda la línea de nuevo

Answer 3

clearRect() es la única manera de hacerlo. Una buena forma de evitar esto (si tienes muchos elementos dibujados en tu lienzo) es superponer dos lienzos en el HTML usando posicionamiento absoluto, usando uno para el dibujo "estático" y una capa superior para el dibujo que planeas borrar/redibujar Esto también ahorra tiempo de CPU al dibujar todo su lienzo nuevamente.

Answer 4

Otra opción elegante es establecer el 'globalCompositeOperation' a 'XOR' y la pintura que se alinean de nuevo. ... por lo que será eliminado