CODEWITHSUNDEEP
three.js
user3836200
user3836200

Reputation: 111

How to select an object and move camera into to another position?

I have a problem I don't known how I can select the position of the selected inside scene and move camera into it

I found a project sample, and I want to build an example like it

Sample project

Thank you so much!

Upvotes: 0

Views: 692

Answers (1)

Mugen87
Mugen87

Reputation: 31086

You basically solve this problem in two steps:

First, you have to make 3D objects selectable which can be done via raycasting. There are many official examples that demonstrate 3D interaction based on raycasting, for example:

https://threejs.org/examples/webgl_interactive_cubes

If you know that a certain 3D object was clicked, you animate the camera from its current position to a defined target position. The possible target positions can be defined prior or you compute the in some way on the fly based on the object's bounding volume and the current camera position. The actual animation can be done in many ways. One approach is using a tweening engine like tween.js. Check out the following example to see how it is used together with three.js:

https://threejs.org/examples/css3d_periodictable

Upvotes: 3

Related Questions