react-canvas-draw icon indicating copy to clipboard operation
react-canvas-draw copied to clipboard

Add eraser mode

Open embiem opened this issue 5 years ago • 7 comments

In #34, an eraser prop was proposed. This could be a new eraser boolean prop on the component. When active, drawn lines intersecting with the pointer are removed instead of drawn.

embiem avatar Nov 22 '19 12:11 embiem

I've put together an eraser prop, you can demo it here. We could also implement an 'eraserColor' prop rather than having it hard-coded. The one current downside is that all of the eraser lines are added the same way that brush lines are added, adding some unnecessary length where eraser points aren't intersecting brush points. I can fix this, but I just wanted to check if this is headed in the direction that you had in mind.

Also, if you take a look at the 'export' button in the demo, I could add this as a prop to make it more readily accessible (as I see there's already an issue open for this).

WallTack avatar Jan 23 '20 22:01 WallTack

hey WallTack can you share the source code how you implemented the eraser in the library.

rish6696 avatar Apr 21 '20 14:04 rish6696

@WallTack great demo, thanks for sharing! I'd also like to know more about the implementation. If you want, you can add a PR.

Regarding the export functionality: if you have the time, please submit a PR. For coordination, please use issue #43 and PR #67, where some work on it has already been done.

embiem avatar Apr 27 '20 19:04 embiem

I needed an eraser mode myself, I saw some issues in the one from @WallTack that did not fit in my use case 1 - It does not erase directly, just paints a color line and erases later, I needed it to erase the same way as it would paint 2 - If its a hardcoded color, it will not work with background images.

I made the eraser mode and also a sticker mode to put stickers on the canvas passing svg or png images. Is this wanted in a PR?, I've seen there are 7 open already

ivanloy avatar Jul 08 '20 09:07 ivanloy

I needed an eraser mode myself, I saw some issues in the one from @WallTack that did not fit in my use case 1 - It does not erase directly, just paints a color line and erases later, I needed it to erase the same way as it would paint 2 - If its a hardcoded color, it will not work with background images.

I made the eraser mode and also a sticker mode to put stickers on the canvas passing svg or png images. Is this wanted in a PR?, I've seen there are 7 open already

I can see that?

ziaongit avatar Oct 21 '20 10:10 ziaongit

@WallTack @ziaongit Is the code of your erasers is available somewhere, the canvas is amazing but this functionality is a must for me?

scloutier75 avatar Jun 15 '22 11:06 scloutier75

@WallTack Nevermind, just found the code in your repos, thanks.

scloutier75 avatar Jun 15 '22 11:06 scloutier75