场景中的静态对象 - Three.js [英] Static Object in Scene - Three.js
问题描述
我的场景中有两个对象.我正在使用
I have two objects in my scene. I am using the
<script src="js/controls/LeapTrackballControls.js" ></script>
用于移动相机，所以感觉物体随着我手的移动而旋转.
for moving the camera, so it feels like the objects is rotating according to the movement of my hand.
问题是另一个对象也在移动，我希望它始终在我面前.我的意思是，即使相机移动，对象也始终位于画布/资源管理器内的同一个位置.
The problem is that the other object is also moving, and I want it to remain always in front of me. I mean, that even if the camera moves, the object always is in the same place inside the canvas/explorer.
对不起，如果我没有正确解释自己.
Sorry if I'm not explaining myself properly.
感谢任何帮助.
var controls = new THREE.LeapTrackballControls( camera , controller );
所以，我在场景中间有一个球体.我使用 LeapTrackball 库围绕场景中心移动相机.这让用户感觉球体围绕着他的中心旋转.
So, I have a sphere in the middle of the scene. I use the LeapTrackball library to move the camera around the center of the scene. This makes the user feel like the sphere is rotating around his center.
model = new THREE.Mesh(modelGeo, modelMat);
model.geometry.dynamic = true;
model.position.set(0, 0, 0);
scene.add(model);
我的问题是我有另一种形状:
My problem is that I have another shape:
myMesh = new THREE.Mesh(circleGeometry, material);
myMesh.position.set(0, 0, 10);
scene.add(myMesh);
这也受相机旋转的影响.我想要的是保持球体的假旋转"，而另一个网格保持在屏幕中间(0,0,10).
that is also affected by the rotation of the camera. What I want is to keep the 'fake rotation' of the sphere, while the other mesh stays in the middle of the screen (0,0,10).
好的，这是我的相机对象.
Ok, so this is my camera object.
var camera = new THREE.PerspectiveCamera(55, window.innerWidth/window.innerHeight, 0.1, 5000);
var camera = new THREE.PerspectiveCamera(55, window.innerWidth / window.innerHeight, 0.1, 5000);
还有我的渲染函数，用于更新相机的控制/移动.
And my render function, which is used for update the control/movement of the camera.
function render() {
controls.update();
renderer.render(scene, camera);
doMouse();
if(useOrbitControls){
orbitControls.update();
}
}
我正在使用 Leap 控制器，这是构建它的函数:
I'm using a Leap controller, and this is the function that builds it up:
function leapMotion() {
var controllerOptions = {
enableGestures: true
, background: true
, frameEventName: 'animationFrame'
, };
[...]
controller.on('frame', onFrame);
基本上，这意味着 onFrame 函数在每次收到帧时都会执行(大约每秒 60 帧.)
Basically, this means that the onFrame function is done everytime that it receives a frame (60 per second aprox.)
function onFrame(frame){
[...]
}
没有更多，所有的魔法都来自您可以在这里找到的图书馆:
There is not much more, all the magic comes from the library that you can find here:
https://leapmotion.github.io/Leap-Three-Camera-Controls/
推荐答案
如果您希望将对象(例如十字准线)固定在相机前，可以通过将该对象添加为相机.使用这样的模式:
If you want an object -- such as crosshairs -- to be fixed in front of the camera, you can do so by adding the object as a child of the camera. Use a pattern like this one:
scene.add( camera ); // required when the camera has a child
camera.add( object );
object.position.set( 0, 0, - 100 ); // or whatever distance you want
three.js r.71
three.js r.71
这篇关于场景中的静态对象 - Three.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
