Hello,

I have a camera function which the user clicks on the screen and the camera moves to that location. The problem how ever is the camera moves way past the point the user clicked, and the camera moves faster the further away the location of the click was from the camera.

I believe it is related to my maths in the fraction function but this is the whole animation code:

if(evt.button == 0){ // left click clearInterval(this.scroll); var initial = worldPosition(canvas.width/2,canvas.height/2), target = worldPosition(mouse.onElement.x,mouse.onElement.y), deltaX = (target.x - initial.x), deltaY = (target.x - initial.y), timeStart = Date.now(), timeLength = 800; // see below code snippet for data example console.log(initial); console.log(target); console.log({'Dif X':target.x-initial.x,'Dif Y':target.y-initial.y}); function update(){ function fraction(t){ var difx = target.x - (initial.x + t*deltaX); var dify = target.y - (initial.y + t*deltaY); camera.x -= difx; camera.y -= dify; } function easing(x){ return 0.5 + 0.5 * Math.sin((x - 0.5) * Math.PI); } var t = (Date.now() - timeStart) / timeLength; if (t > 1) { fraction(1); clearInterval(this.scroll); } else { fraction(easing(t)); } } this.scroll = setInterval(update, 1); //start animation }

Initial : {x: 576.3685331485237, y: -2608.131466851476} Target : {x: 577.3685331485237, y: -2615.631466851476} Deltas : {Dif X: 1, Dif Y: -7.5}

Can any one shed light on where I am going wrong here?