Smooth camera float based on mouse movement?

https://playcanvas.com/project/796569/overview/brass

As per a suggestion, I am trying to add a little camera float based on mouse movement for my otherwise static scene, but my methodology is lacking.

I originally used a tween to make the camera movement smooth, but since the destination input is updated throughout the mouse’s movement, the tween constantly reset, resulting in a juddery, stuttery movement.

Now I have implemented a simple setPosition for the camera, updating constantly. The drawback is that the camera SNAPS to mouse position once the main animation is complete, or (on mobile) when a button is pressed (since there is no mouse to track).

Any suggestions/examples for a smooth/tweening camera float based on mouse input (and, for mobile, device tilt/orientation!) that updates its destination smoothly, without resetting?

PlayCanvas allows to interpolate two vectors. There is an example, where a camera was moving from a fixed point A to a moving point B, by interpolating those positions. It is pretty much the same case for you, except your target vector is changing, based on mouse/touch input:

2 Likes

Thanks-- I’ll revisit the code based on this example. I figured there was a method, although I’m not entirely sure I am up to figuring it out (yet).