I'd like to make an orientation view cube in three JS.
The "View Cube" is in a scene using Orthographic Camera and OrthographicTrackballControls .
What I actually do is create a view cube:
gizmoBox = new THREE.Object3D();
for (var x = -1; x <= 1; x+=1) {
for (var y = -1; y <= 1; y+=1) {
for (var z = -1; z <= 1; z+=1) {
if (/* is a corner coordinate */) {
corner = new THREE.Mesh(...);
...
gizmoBox.add(corner);
} else if (/*is a border coordinate*/) {
edge = new THREE.Mesh( ... );
...
gizmoBox.add(edge);
} else if (/*is a side coordinate */) {
side = new THREE.Mesh(...)
...
gizmoBox.add(side);
/*here, i added some text : FRONT, BACK, ...*/
}
}
}
}
And scale it to be in the upper right corner of the camera:
function render() {
...
var vec = new THREE.Vector3( 0.0145 / camera.zoom, 0.012 / camera.zoom, 0.01 / camera.zoom );
vec.applyQuaternion( camera.quaternion );
gizmoBox.position.copy( vec );
gizmoBox.scale.set(0.0015 / camera.zoom, 0.0015 / camera.zoom, 0.0015 / camera.zoom);
...
renderer.render( scene, camera );
}
Then I want to use the position of every parts of the view cube (before scaling) as "reference point" in the the scene to make the rotation. So I added this function in OrthographicTrackballControls .
this.rotateViewCube = function (refPoint) {
_rotateEnd.copy(refPoint);
_this.rotateCamera();
};
But it doesn't work correctly, the camera move but not as I expected. Someone as an idea?
I found a solution by myself.
I get the "reference point" form the clicked part of the View Cube, then I modify the default camera position in OrthographicTrackballControls (refered by position0 ). And finally I reset it.
var position = intersects[0].object.refPoint;
controls.position0.copy(position);
controls.reset();
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.