Hi!
At the moment the object rotates (X & Y) slightly as you move the mouse around the canvas but I’d like to make this movement smoother. Could anyone guide me so I know I’m going in the right direction please? I’m quite new to Babylon JS so I’m not sure if this is going to even work. So far the function below doesn’t work:
function onMouseMove(){
camera.target = ground;
var xRotation = new BABYLON.Animation("ground", "rotation.x", 30,
BABYLON.Animation.ANIMATIONTYPE_FLOAT,
BABYLON.Animation.ANIMATIONLOOPMODE_CYCLE);
var xRotation = ground.rotation.x = -(scene.pointerY-canvas.height/2)/2000;
var yRotation = ground.rotation.y = -(scene.pointerX-canvas.width/2)/2800;
var easingFunction = new BABYLON.CubicEase();
easingFunction.setEasingMode(BABYLON.EasingFunction.EASINGMODE_EASEIN);
xRotation.setEasingFunction(easingFunction);
yRotation.setEasingFunction(easingFunction);
ground.animations.push(xRotation);
}
canvas.addEventListener('mousemove',onMouseMove);
Thank you and sorry for the late reply @Deltakosh. I haven’t had the chance to do any work on this til today. I took your advice and used inertia to apply a smoother movement. Although it seems to work I noticed that if the mouse leaves the canvas let’s say from the top left corner and enters it back from the top right corner, eventually, after repeating those actions a few times, you’re able to horizontally rotate the map all the way. Same thing happens vertically when the mouse leaves from top/bottom.