How to use inner camera in gltf in aframe?

Question

I have a gltf model, which contains cameras, models and camera animations. After loading, they become an gltf entity. I can't use secondcamera el. SetAttribute ('camera ','active', true ')" to change camera. How can I use the camera in it.

This can be modified in three. JS

this.content.traverse((node) => {

if (node.isCamera && node.name === name) {

this.activeCamera = node;

}

});

this.renderer.render( this.scene, this.activeCamera )

but, how to use inner camera in gltf in aframe?

Answer 1

You could keep the reference to the camera:

var model_camera = null;
// wait until the model is loaded
entity.addEventListener("model-loaded", e => {
  const mesh = entity.getObject3D("mesh");
  mesh.traverse(node => {
    // assuming there is one camera
    if (node.isCamera) model_camera = node;
  })
})

and when you need to use it, just substitute the active camera in the scene.camera property:

entity.sceneEl.camera = model_camera;

Check it out in this example with a model containing two different cameras.

---

Afaik there is no cleanup involved, the look-controls or wasd-controls will still be working as long as you don't manually disable them when switching cameras.

The camera system has a function for swapping active cameras, but you would need to add <a-entity> wrappers for the camera references (as the system tries to perform getObject3D('camera') on the provided entity).