Make objects move away from mouse

Hi I’m fairly new to ThreeJS and also react three fiber. I’m trying to make an animated glb model move away from my mouse (i.e. bird flies away) when the mouse gets near the object then have the model return to its initial location once the mouse has left the vicinity. How would I go about doing this?

An explanation towards react three fiber is preferable, but I’m fine with ThreeJS if preferred!

I would check out raycasting. I would think you can adjust and object position if your cursor intersects with it.

https://threejs.org/docs/#api/en/core/Raycaster

1 Like

Thanks Chris! That looks like exactly what I’m looking for.

No problem, I forgot to mention, I think you mentioned React. I would store the original object to state using an array so you can move it back to the original position. There are methods for this in the Object3D class. If you are new to Three.js I would recommend this class. Its really good and very fun

Good point on state handling.

Also, that looks like a good course. Thanks for letting me know.