A quick question about camera, camera lookat and model position

Questions
,
1

I am a bit confuse with camera positioning for my gltf model. a bit camera.position need to understand where my gltf bottom center is 0,0,0 of canvas. now i want to position model at right side of screen where a bit caption is written at left side.

how can i adjust my camera.position.set, camera.looAt and model.position.set. really need advice to grip camera positioning subject.

attach diagram for model placement.

screen
screen1920×1080 74.8 KB

appreciate advice/help/guidance/whatever :slight_smile:

2

It’s a bit more complex than just using a lookAt , you need to calculate the object’s position relative to the viewport width, camera distance, and fov.

function updateMeshPosition() {
  const distance = Math.abs(camera.position.z - mesh.position.z);
  const halfHeight = Math.tan((camera.fov * Math.PI) / 360) * distance;
  const halfWidth = halfHeight * camera.aspect;
  
  mesh.position.x = halfWidth / 2;
}

The updateMeshPosition is called at the initialization, window.onresize and at the OrbitControls change event.

Also, to avoid camera edge distortion effect, use a smaller camera fov and a larger distance camera.position.z

1 Like