极简 视图 旋转魔方

项目内需要一个旋转视角功能，用Three.js的CameraControls.js过于复杂，处于这样的考虑，需要实现一个基本的旋转效果。

![GIF.gif](p9-juejin.byteimg.com/tos-cn-i-k3…

折腾了一会代码，像我这样数学底子比较薄弱的，简直是一地鸡毛，翻出了大一解析几何的教材，纳闷当年是如何考过的

这里需要那么一点点数学，就那么一点点，

还有就是，摄像机的目标对好坐标轴原点

var PI_2 = Math.PI *2;
theta -= (PI_2 * speed * dx);
phi -= (PI_2 * speed * dy);
phi = Math.min( Math.PI, Math.max( 0, phi ) );
camera.position.x = radious * Math.sin( theta )* Math.cos( phi );
camera.position.y = radious * Math.sin( phi );
camera.position.z = radious * Math.cos( theta )* Math.cos( phi);
camera.lookAt(new THREE.Vector3(0, 0, 0));
camera.updateMatrix();

最后是小抄 github