I implemented MathML as web components a few years ago as a work around. It wasn't super hard, but a native implementation provides so much better accessibility (and, likely, perf) https://github.com/pshihn/math-ml
The way excalidraw does it, it collects all the points from mouse-move events, then uses the algorithm to take those points and reduce the number of points. The reduction is done by a 'distance' parameter in the algorithm. So instead of `n` points, you now have `m` points. m < n. Then excalidraw fits a rough curve through those `m` points. This fitting is automatically done in roughjs. Fewer points and curve fitting gives the effect you mentioned.
I wrote roughjs a couple of years ago and had always thought it would be nice to use it in all the ways people draw hand-drawn shapes. Annotation is one of them. I never got around to implementing it.
Since roughjs does most of the heavy lifting, implementing this was not a lot of time. I did it in a day (~4-6 hours).
Actually it took longer to make the website for the project and writing the readme :/
Yes definitely possible. It just looks more sketchy with two passes. And it should be easy to configure. Perhaps add to the issues with any thoughts? Thanks https://github.com/pshihn/rough-notation/issues
It's an artifact of how Rough.js renders sketchy lines. It does that by creating some random offsets. For some random values, it may create this effect for long lines, which is not ideal. This is less pronounced in shorter lines. The latest release has tried to reduce this effect, but there is a small probability that it may still happen: https://roughjs.com/posts/release-4.0/
True but having raw parts would give it more flexibility when animating or changing sections of the image. Especially when the canvas size is large, it won't be as optimal