How can I automatically focus the camera ( target, orbit and zoom ) on a specific material?

[jaypanchal347]

I want to focus the camera on a specific material either by inputting its name or index maybe. I'm okay with any javascript coding solution if there isn't a simple workaround.

[elalish]

That's not as simple as it sounds. I'd recommend choosing the camera parameters manually - you can copy them out of our editor's snippet.

[jaypanchal347]

Thank you for your response. I understand that it’s not easy to achieve, but any help from your side would be greatly appreciated! Here’s what I have managed to do so far:

`
function getCameraTargetForAllMesh(){

    const modelViewer = document.querySelector("model-viewer");
    const scene = modelViewer[
        Object.getOwnPropertySymbols(modelViewer).find(
          (e) => e.description === "scene"
        )
      ];

      const targetArray = [];
        scene.traverse(function (child) {
        if (child.isMesh) {
            const target = child.geometry.boundingSphere.center.toArray().map(value => `${parseFloat(value.toFixed(4))}m`);
            targetArray.push(target.join(' '));
            
        }
    });
    return targetArray;
}

`

Using this code, I’m able to get decent results for retrieving the camera targets for each mesh. Could you assist me with setting the camera orbit and field of view? Any Tips and Tricks?

[elalish]

https://modelviewer.dev/docs/index.html#entrydocs-stagingandcameras-attributes-cameraOrbit