首页 文章

使用Three.js在物体周围旋转相机

提问于
浏览 次
14

我正在使用WebGlRenderer显示带有Three.js的OBJ元素，现在我想允许用户在任何方向上围绕对象旋转相机，我找到了这个答案：

Rotate camera in Three.js with mouse

但是这两个例子都给我带来了错误，第一个说没有定义投影机，我不知道“投影机”是什么意思 . 我只是一个简单的相机，物体和一些光 . 第二个代码表示undefined不是一个函数 .

有人知道如何获得我需要的结果吗？

javascript camera three.js

2 回答

  • 31

    这就是你想要的：http://threejs.org/examples/misc_controls_orbit.html

    包括轨道控件（下载后）：

    <script src="js/controls/OrbitControls.js"></script>

    设置变量：

    var controls;

    将控件附加到相机并添加一个监听器：

    controls = new THREE.OrbitControls( camera );
controls.addEventListener( 'change', render );

    并在您的animate函数中更新控件：

    controls.update();

    [更新] controls.autoRotate = true; （在v73中测试 . 最近版本的OrbitControls.js添加了此控件 . ）

    回复于
  • 1

    实际上，如果用您选择的对象替换“相机”，则对象将旋转 . 但如果周围有其他物体（例如地板上的网格），它们仍然会静止不动 . 这可能是你想要的，或者看起来很奇怪 . （想象一下椅子在地板上漂浮......？）

    在初始化Orbit Controls之后，我选择从我的代码中覆盖OrbitControls.JS中心对象

    controls = new THREE.OrbitControls(camera, renderer.domElement);
…
controls.center =  new THREE.Vector3(
    chair.position.x,
    chair.position.y,
    chair.position.z
);

    （免责声明：我的印象是有不同版本的OrbitControls.js，但我认为他们都使用这个中心对象）

    回复于

相关问题