Tuesday, 5 November 2019

Basic Javascript Drawing with User Editable Lines and Nodes

My research has found me powerful libraries like paper.js which are quick to show all the next-level awesome stuff they can do, but I'm not sure how (or if) I can accomplish a basic task:

I want to present a simple Stick Figure to my user:

  o
 \|/
 / \

Then let them grab the ends of the lines ("hands and feet"), and drag them into different positions, leaving the connecting nodes ("shoulders and hips") intact.

Simple.

In short, what is the simplest way to draw something with lines and nodes that users can manipulate.

Requirements:

  • Some line lengths are fixed, others can be lengthened.
  • Some nodes are fixed, others can be moved.
  • I need to at least display the angles of the lines, but ideally can modify those angles (via text input).

I feel like this shouldn't be this hard, but as I said, most libraries skip the basics and go straight to their coolest features, while any search for "edit vector nodes" and the like brings up lots of irrelevant results about node.js...



from Basic Javascript Drawing with User Editable Lines and Nodes

No comments:

Post a Comment