我一直在尝试创建一个简单的球体，它能够像本例中那样用鼠标旋转。
然而，当我尝试旋转球体时，它并没有像前面的例子那样移动，而是在许多不同的方向上移动并且非常加速。
我尝试了几种不同的旋转速度设置组合，但它们都不起作用。
var _container, _camera, _renderer, _scene, _controls;
$(document).ready(function () {
// init the animation.
init();
// animate.
animate();
});
/* Initialize the animation */
function init() {
// get the container size.
_container = $('#animation');
var height = _container.innerHeight();
var width = _container.innerWidth();
// create the renderer and add it to the container.
_renderer = new THREE.WebGLRenderer({ precision: 'highp', antialias: true });
_renderer.setSize(width, height);
_container.append(_renderer.domElement);
// create the scene.
_scene = new THREE.Scene();
// create the camera and add it to the scene.
_camera = new THREE.PerspectiveCamera(25, width / height, 50, 1e7);
_scene.add(_camera);
var radius = 50;
// trackback _controls settings.
_controls = new THREE.TrackballControls(_camera, _renderer.domElement);
_controls.rotateSpeed = 0.5;
_controls.zoomSpeed = 1.2;
_controls.panSpeed = 0.2;
_controls.noZoom = false;
_controls.noPan = false;
_controls.staticMoving = false;
_controls.dynamicDampingFactor = 0.3;
_controls.minDistance = radius * 1.1;
_controls.maxDistance = radius * 100;
_controls.keys = [65, 83, 68]; // [ rotateKey, zoomKey, panKey ]
// create a sphere and add it to the scene.
var sphereGeo = new THREE.SphereGeometry(45, 30, 20);
sphereGeo.computeTangents();
var sphere = new THREE.Mesh(sphereGeo,
new THREE.MeshBasicMaterial({ color: 0xff0000, wireframe: true }));
_scene.add(sphere);
}
/* Animates the scene */
function animate() {
requestAnimationFrame(animate);
// render the scene.
render();
}
/* Renders the Scene */
function render() {
// set the camera to always point to the centre of our scene, i.e. at vector 0, 0, 0
_camera.lookAt(_scene.position);
// move the camera in a circle with the pivot point in the centre of this circle
// so that the pivot point, and focus of the camera is on the centre of our scene.
var timer = new Date().getTime() * 0.0005;
_camera.position.x = -Math.floor(Math.cos(timer) * 200);
_camera.position.y = 50;
_camera.position.z = Math.floor(Math.sin(timer) * 200);
_controls.update();
_renderer.clear();
_renderer.render(_scene, _camera);
}