threejs球体旋转与场景旋转_threejs 入门 绕定点旋转和自旋

原文链接: threejs 入门 绕定点旋转和自旋

three用起来和fabric很像, 只不过可以更加细致的控制绘制

不错的教程

http://www.yanhuangxueyuan.com/Three.js/

效果, 可以通过拖拽和滚轮控制相机位置和视角

clone仓库, 或者使用cdn

git clone --depth=1 https://github.com/mrdoob/three.js.git

demo, 最后都是数学问题... 只要能够算出各个时刻的位置就行了

Document

const scene = new THREE.Scene();

const boxGeometry = new THREE.BoxGeometry(100, 100, 100); //创建一个立方体几何对象Geometry

const boxMaterial = new THREE.MeshLambertMaterial({

color: 0x0000ff,

}); //材质对象Material

const boxMesh = new THREE.Mesh(boxGeometry, boxMaterial); //网格模型对象Mesh

console.log(boxMesh.position);

scene.add(boxMesh); //网格模型添加到场景中

const sphereGeometry = new THREE.SphereGeometry(60, 40, 40); //创建一个球体几何对象

const sphereMaterial = new THREE.MeshLambertMaterial({