steveruizok / perfect-freehand

Draw perfect pressure-sensitive freehand lines.
https://perfectfreehand.com
MIT License
4.52k stars 159 forks source link

[Bug] Backtracking creates dots on end of lines #48

Closed sandorex closed 2 years ago

sandorex commented 2 years ago

As i mentioned in https://github.com/excalidraw/excalidraw/issues/4802#issuecomment-1145413251

Moving cursor in opposite direction while drawing makes these weird dots, much more common on wacom tablet for some reason

freehand playground image

freehand playground but using the mouse image

TodePond commented 2 years ago

Also found this - screenshot from the playground: image

Quite a small issue I think, because it's generally quite hard to reproduce+notice, but I've been using perfect-freehand in an app where the stroke bounces back a bit at the end, which reliably causes it quite a lot: image

TodePond commented 2 years ago

Potentially related to this part? https://github.com/steveruizok/perfect-freehand/blob/main/packages/perfect-freehand/src/getStrokeOutlinePoints.ts#L210-L239

Answer: I don't think so! I disabled that section of code and it's still reproducible. FUTURE EDIT: It was actually this. image

I'll look elsewhere!

TodePond commented 2 years ago

Potentially related to it "flipping over"? image image

TodePond commented 2 years ago

You can see it cross over for a frame or two: GIF 22-08-2022 14-20-49 GIF 22-08-2022 14-24-06

TodePond commented 2 years ago

Making the Handle sharp corners code run based on previous dot-product instead of next dot-product helped in some cases:

Before: image

After: image

TodePond commented 2 years ago

Ok and if I make it check nextDpr as well as prevDpr it seems to fix all those cases: image

Still some issues going on though.

TodePond commented 2 years ago

Ok so now we get this issue: image

What's happening? Answer: After a stroke does a sharp corner, it keeps doing sharp corners every point. This is because it now looks for sharp corners based on the next point AND the previous point. It can end up detecting a sharp corner twice, and then keeps on flip-flopping. Maybe we could keep some state to make sure it doesn't do the same sharp corner twice...

It works! image

And the fix still works! image

I'm gonna clean up the code and do a pull request I think.

steveruizok commented 2 years ago

Awesome work!

sandorex commented 2 years ago

Nice work, ill close this now