Comments (5)
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?
from camera-controls.
Thanks for using camera-controls.
I think it's because setOrbitPoint calls setFocalOffset internally, and focalOffset causes many problems, like
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...
from camera-controls.
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)?
from camera-controls.
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...
from camera-controls.
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 π
from camera-controls.
Related Issues (20)
- Not update in worker HOT 5
- I want to replace camera-controls with the default controls in my project, here is an example, how can I do it to be compatible correctly? HOT 2
- fitToBox on a plane: how to prevent plane to get perpendicular to view? HOT 1
- Dolly to cursor reaches limit HOT 4
- Dolly to cursor does not maintain steady speed HOT 1
- Roll/tilt control HOT 1
- Can't zoom after switching between cameras HOT 10
- Cannot dispatch custom event HOT 4
- It would be nice to have setFov method with smooth transition HOT 2
- Transition updateCameraUp HOT 1
- Control functions skip frames when frameloop = demand HOT 3
- setFocalOffset -- How to keep the model always facing the screen HOT 2
- Use .isSphere instead of "instanceof Sphere" HOT 2
- The automated release is failing π¨ HOT 1
- Can you add an "autoRotate" function, like OrbitControls in Threejs? HOT 2
- moveTo changes target incorrectly
- using "isSphere" requires three.js version compatibility bump to r160 HOT 3
- Collision detection is abnormal HOT 3
- Behavior similar to three.js Trackball Controls HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. πππ
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google β€οΈ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from camera-controls.