如何使用three.js旋转关于中心的平移对象？

Question

使用three.js可以将平移对象围绕其中心旋转。我创建了一个jsfiddle，http://jsfiddle.net/yKt6h/4/

当我检查控制面板中的自动旋转模式时，我可以将平移后的立方体绕其中心旋转。当我尝试用鼠标移动旋转立方体时，是否有可能产生类似的效果？

如果可能的话，请给我提供的示例代码

Answer 1

查看您的jsfiddle THREE is not defined然而，当我得到在控制台的错误你所要求并不困难。轨迹球相机的设计完全符合您的需求。如果您在原点渲染对象，则只需初始化轨迹球控件即可。我创建了一个简单的moon demo that uses TrackballControls。您无需在TrackballControls.js中进行任何修改。

在上面的演示中，我调用一个函数初始化轨迹球控制功能在我ThreeUtil.js文件中定义为：

function initTrackball(camera, rotate, zoom, pan, damping) { 
    var controls = new THREE.TrackballControls(camera); 
    controls.rotateSpeed = rotate || 1.0; 
    controls.zoomSpeed = zoom || 1.2; 
    controls.panSpeed = pan || 0.8; 
    controls.noZoom = false; 
    controls.noPan = false; 
    controls.staticMoving = true; 
    controls.dynamicDampingFactor = damping || 0.3; 
    return controls; 
} 

如果你不希望用户能够平移或缩放，只能够围绕您的对象旋转，然后在上面的函数中简单设置controls.noZoom = true和controls.noPan = true。

因为我的月亮对象是在我的场景原点所有我需要做的就是设置相机一定距离的由来。我们将把它放在正z轴上，因此它已经在原点处查看我们的对象。然后我们调用上面的函数来设置控件。我通过在一个自定义的转速：

controls = initTrackball(camera, 0.8); 

然后在每一帧所有你需要做的就是调用你的动画循环更新功能：

controls.update(camera);