JavaScript - Free draw an enclosed area on a canvas and record path

Asked Nov 19 '16 at 14:40

Active Nov 19 '16 at 16:59

Viewed 511 times

CONTEXT

I want to create an interaction where the user sees an image and can free draw onto the image in order to select a part of it. The goal is to have the user draw an enclosed shape around an area in the image, similar to how the Photoshop Lasso Tool behaves. I then need to pull the coordinates of everything that falls within the area they have enclosed.

PROGRESS SO FAR

On one hand, I know I can use tools such as sketch.js in order to free draw. I have also seen many of drawing various enclosed shapes.

QUESTION

How can I combine the two concepts above (free draw + enclosed shape) to free draw an enclosed area?
How can I record the coordinate that fall within the enclosed area? Or, at the very least, the coordinates of the free drawn path.

edited Nov 19 '16 at 16:59

Philip Kirkbride

21,381
38
125
225

asked Nov 19 '16 at 14:40

Sekoul

1,361
2
14
30

2

http://stackoverflow.com/questions/29366490/lasso-tool-in-html5-canvas – tomasantunes Nov 19 '16 at 14:48
Exactly what I needed, thanks for your help! – Sekoul Nov 19 '16 at 14:53

JavaScript - Free draw an enclosed area on a canvas and record path

0 Answers0