How do I rotate the model in the center of a 200px shift

Hi, everybody. I need some help.

This is the codepen address:

My 3D scene is full screen and has to be full screen, but I have the menu area to the left, I need to move the model to the screen minus the center point of the left menu area, and then rotate the camera to surround the model.

Thank you very much.

Is the model static or movable? If the first one, this thread is pretty much all the calculations you need - if the second one, it’s not really possible. If the model is movable, it’s size will change according to the perspective, rotating the camera will change the relative depth of the model, changing the meaning of “200px” for it.

1 Like

The position of the model is static, but the camera can be panned,I’ll check the post you quoted

Can you make your canvas only fill the content area on the right instead of having it extend underneath the UI on the left?

Once you try introducing offsets to the camera / controls target points… things can get really messy.

If you really have to though, you can do an offset to the controls target after you set it like you normally do… then offset it with something like… THREE.Vector3( -3,0,0).applyQuaternion(camera.quaternion) );

For some reason, I could only extend the canvas to the bottom of the user interface, it felt like it would be out of my control to offset it, another option I had was to zoom in on the canvas to make it the center.