Svg follow the cursor along a regression curve

[Andy0]

Hello there,

I have a problem of getting the draggable object adjust to the cursor speed and position along a regression curve,

I managed to drag the svg along the regression curve with the motion path but and getting the color shades change with the cursor position, but can't seem to be able to position the dragable element to a certain position by the aliginOrigin, i don't know how it seemed to fail.

 

i have finally been able to add a the code of the problem (https://codesandbox.io/s/regression-curve-demo-w4v8x?file=/src/App.js)

 

I am really grateful for any help rendered

 

 

 

See the Pen App.js by s (@s) on CodePen

[GreenSock]

5 hours ago, Andy0 said:

i wasn't able to reproduce it on codepen because it is in react.

You are welcome to use CodeSandbox.io instead if you're not sure how to use React in CodePen. Here's a starter template you can fork: 

https://codesandbox.io/s/gsap-bonus-plugins-react-starter-je6ln

 

We're happy to answer any GSAP-specific questions. Custom consulting about logic issues is beyond the scope of help we can provide for free, but perhaps if you can provide a minimal demo we'll be able to notice an issue quickly. 

[Andy0]

@jack thank you so much

[OSUblake]

This thread has some good examples to learn from. The demos are using an older version of GSAP and the BezierPlugin, but the concept of how it works is still the same.