Force Feeding not working in Velocity JS

+1 vote
asked Sep 12, 2017 by praneet-rohida

I am trying to use VelocityJS in one of my React projects. The use case where I am facing the problem is:

There is pointer created in SVG, initially at the center of the screen. I want to move the pointer with the keyboard arrow keys. I have maintained a state variable for updating the X and Y values of the pointer on keydown event. On the callback of setState, I am calling a translate function which animates the translation. But the problem I faced is that The animation always happened from the initial position of the pointer i.e. center of the screen. So as a workaround I tried was that I maintained the previous position of the pointer in state too, using forcefeeding in velocityJS. Someone go through my code and see if I am doing something wrong.

$(".Aim").velocity( { translateX: [this.state.aimX, this.state.aimXOld], translateY: [this.state.aimY, this.state.aimYOld] }, { duration: 500, easing: [0.46, 0.46, 0.46, 0.46], complete: () => { console.log("completed"); } }

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
Anti-spam verification:
To avoid this verification in future, please log in or register.
Welcome to Q&A, where you can ask questions and receive answers from other members of the community.
Website Online Counter