3

I'm trying to achieve this bend effect on a path, This effect takes an existing path (skeleton) and allows one to “bend” it in a shape path. The style of the bent path is taken from the style of the original shape path. like this image

can someone tell me a way to achieve this effect? this deformation is used in the vector drawing tool Inkscape, which uses svg as a standard, and I would like to use animating with javascript and found this library warp.js, I am not sure how to try to implement this effect, any direction would be of great help.

The description of how the effect works is on this link http://tavmjong.free.fr/INKSCAPE/MANUAL/html/Paths-LivePathEffects-BendTool.html and here is the c ++ implementation of the bend tool, has a brief description of the theory from J.F. Barraud, https://gitlab.com/inkscape/inkscape/-/blob/master/src/live_effects/lpe-bendpath.cpp

even with the description I couldn’t understand what to do as a starting point, any help is welcome

Jaron Wanderley
  • 31
  • 1
  • Generally speaking, these types of curves are known of as `splines` Curves can be of differing complexities, but these ones seem simple with only 3 or 4 control points affecting where each point on the spline lies. Here's another discussion on the matter: https://stackoverflow.com/questions/7054272/how-to-draw-smooth-curve-through-n-points-using-javascript-html5-canvas – enhzflep May 23 '20 at 12:23
  • I know how to create the paths, but not bend a path to follow another... – Jaron Wanderley May 23 '20 at 23:16

0 Answers0