I'm implementing push contour feature for web application. It is an ability to change the contour by touching it. Mouse pointer becomes a circle that bumps contour (like in Photoshop). Contour is polyline object and pushing circle is some point with defined radius.
Sequence of actions on mousemove
is following:
- Detect points in polyline that are closer to pushing point than defined radius
- push those points or just draw circle segment in the defined area.
Questions:
- How to determine points that are need to be pushed? I can iterate all segments in polyline (300-600 segments) and calculate distance for each like here: https://gist.github.com/mattdesl/47412d930dcd8cd765c871a65532ffac . But in this case full iteration 60 times per second is quite performance hard. May by some algorithm can do it more afficient?
- How to push the point? we can't just change it position. As 1 point finally can become 2 points. It is more like drawing circle segment.