What I would like to do is to is render a model, say a house and then have a dropdown box with all the “components” of the house. When I select the component in the dropdown box the camera should focus on this component.
So I do know that I will use the controls.target.set option to be able to change where the camera is looking.
I would like to for example select the door and the controls should then update to show the position of that door.
Is there perhaps an example someone knows of which has similar functionality?
I do not see something like this on the examples page of threejs.
You don’t rotate the map, with OrbitControls, the camera moves around the object. That is why absolute position/target can be used to focus on specific objects
Am I correct in saying that you are the creator of ThreeML?
Is it possible for me to use this library in an Angular project?
Is there perhaps a npm package I can install which will allow me access to the methods in ThreeML?
I need access to the method threeml.moveToPosistion() as you mentioned earlier.
My scenario is this:
I load a .glb file using the GLTFLoader provided by three.js.
I then set the scale using object.scene.scale.set()
I have dropdown box which is populated with a list of co-ordinates which correspond to certain elements of the .glb file.
Currently I am using the controls.target.set method to change the controls to show that specific component. However, the co-ordinates and the scale to do not currently align. Would control.target.set be the right method to use here? Or should I try to use the threeml.moveToPostion() as mentioned?
What type of file is your world map? Is it an actual 3D model?
This would abruptly change the focus of the camera, but maybe you want that.
It is just a plane with a texture (doublesided material). I use json to get the data from the server, and create boxgeometries from that with the correct color, height and location.