Some tips :-
1. When holding down shift allow straight lines only and no curves. It's the norm in design softwares
2. When I drag to create the line, the drop point if off and not accurate to the nearest dot of my mouse position. I'm unsure if it's a bug or have you deliberately built a non-accurate system.
1. That's a good point, I didn't implement this shortcut. In my head, I assumed it wouldn't be useful because the editor only let you do vertical lines, horizontal lines and circle quarter. So making a straight line is pretty easy. If it was pure freeform like on Illustrator, it would be vital. 2. Maybe it's related to the editor only letting you do vertical/horizontal/circle quarter, right?
I tried to make a diagonal without a curve and faced this issue.
Also, I personally find the accuracy important. I understand that it would add complexity to the vertical / horizontal / circle quarter system you've built.
But as a guy who draws, it feels like unnatural when it over-extends.
Either way good luck !
That said, I had a lot of fun with this, bookmarked :)
Edit: Fixed and deployed!
Is there a hotkey to toggle the eraser?
We got so used to read code using frameworks that pure JavaScript seems other world.
Absolutely love small, simple tools like this that have one singular purpose and execute it with restraint.
Another commenter pointed it out, but it rang true for me; it is difficult to make an ugly drawing in this style. Very nice.
I eventually figured it out by accidentally clicking the question mark (I am an avid interface clicker) and read the instructions...
1. Allow for diagonals straight lines 2. Allow for different line thickness