Dolly to Cursor and focalOffset

[Dmitriy]

Describe the bug

Hi. thanks for this library. It helps a lot but i cant solve one problem.
I have OrthographicCamera and dollyToCursor working well but when i setOrbitPoint manually ( i want rotation around my part on scene) or make a movement with offset => after that when zooming with dollyToCursor it jumps by some delta.
Video attached.

To Reproduce

Steps to reproduce the behavior:

1. Set orbit point
2. Make dolly to cursor
3. See that it jumps by some delta

Code

this is creation of camera
const createOrthographicCamera = (name: string, position: Vector3, lookAt: Vector3) => {
            const camera = new OrthographicCamera(-aWidth, aWidth, aHeight, -aHeight, -10000, 10000);
            camera.position.copy(position);
            camera.lookAt(lookAt);
            camera.name = name;
            camera.zoom = 0.33
            return camera;
        };
//___________________________________
i set orbitPoint with help of this
cameraControls.setOrbitPoint(selectedPart.position.x, selectedPart.position.y, selectedPart.position.z)
//___________________________________
this is creation of cameraControls
this.mCameraControls = new CameraControls(camera,renderer.domElement);
this.mCameraControls.smoothTime = 0.15;
this.mCameraControls.minDistance = 1;
this.mCameraControls.maxDistance = 100000;
this.mCameraControls.minZoom = 1e-5;
this.mCameraControls.maxZoom = 1e5;
this.mCameraControls.dollyToCursor = true;
this.mCameraControls.maxPolarAngle = Math.PI;

this.mCameraControls.mouseButtons.right = CameraControls.ACTION.ROTATE
this.mCameraControls.mouseButtons.left = CameraControls.ACTION.NONE
this.mCameraControls.mouseButtons.middle = CameraControls.ACTION.TRUCK
this.mCameraControls.mouseButtons.wheel = CameraControls.ACTION.ZOOM

Live example

No response

Expected behavior

dolly to cursor dollies exactly to mouse location

Screenshots or Video

Recording.2024-03-11.143823.mp4

Device

Desktop

OS

Windows

Browser

Chrome

[Akihiro Oyamada]

Thanks for using camera-controls.
I think it's because setOrbitPoint calls setFocalOffset internally, and focalOffset causes many problems, like

• #303
• #316

TBH, I would like to remove focalOffset and related features such as setOrbitPoint, but still available for backward compat😢

The best solution is, to avoid using setFocalOffset...

[Dmitriy]

But in your examples setOrbitPoint with dollyToCursor is working well. Maybe it is because of using Perspective camera(your examples) instead of Orthographic(in my app)?

[Akihiro Oyamada]

setOrbitPoint with dollyToCursor

Come to think of it, that's right.
Would you mind providing a simplified working demo using codesanbox or so to just reproduce your problem?

setFocalOffset will break dollyToCursor = true anyway...

[AgentCodeBanks]

I had the same problem with my project. I solved it by recalculating the target for the controller with every mouse-up event (after every rotation with changing the orbitPoint). I scale the look vector of the camera with the radius of the spherical in the control and then move the new target with moveTo. Similar to the fitToSphere

const spherical = new THREE.Spherical(0, 0, 0);
const vTempA = new THREE.Vector3();
const vTempB = new THREE.Vector3();
		
container.addEventListener('mouseup', (evt) => {
	if(event.which === 3 ){
		if (controls._camera.isOrthographicCamera) {
			controls.getSpherical(spherical); //Get sperical who is used to calculate the camera position in the update loop
			vTempA.set(controls._camera.position.x, controls._camera.position.y, controls._camera.position.z); //Get camera position
			vTempB.set(0, 0, -1).applyQuaternion(controls._camera.quaternion); //Get the look vector from the camera
			vTempB.multiplyScalar(spherical.radius); //scale the look vector
			vTempB.add(vTempA); // add the camera position to get the new target position

			controls.setFocalOffset(0, 0, 0, false).then(); 
			controls.moveTo(vTempB.x, vTempB.y, vTempB.z, false).then(); //Move the new target to the position
			controls.update(0.0001);
		} else {
			controls.setOrbitPoint(0, 0, 0, false);
		}
	}	
});

I haven't checked the other functions of the controller to see if they still work, as that was the most important thing for me that time.

#yomotsu Do you see any possible problems with the code?

[Vegar Ringdal]

Getting focalOffset working so we could use set orbitpoint without side effects would be very nice.
Atm user in my app need to use ALT+ mouse click to set orbit point. (I then use controller.setTarget(x, y, z, true), so it centers it)
But I notice som users coming fram navisworks really do not like it.

Been a while since I tested, but doing reset on some actions might work.. think it was mainly when using AWSD keys I got some weird jumping, maybe dolly to cursor too.

Think I will give it a new try this week 😄