HTML5 Canvas eraser tool without overdraw white color

Question

I have canvas. I have paint tools pencil and eraser. How i can erase drawings without overwrite(overdraw) with white color.

this my code eraser over drawing with wh

Answer 1

If you want to erase the line than you have two options:

1. use ctx.clearRect() or overdraw with a colour that matches the Background,
2. use layers.

If you need to have a Background image, so that it is not possible to erase with a single color, layers come in handy as a general solution. If you decide to use layers I recommend to use a framework like paper.js or kineticJS, they have this functionality already built in. If you decide to implement layers on your own you could create another above the one for your background, or, you need to store drawing information in a list and redraw the whole canvas each time.