three.js实现让其它模型绕中间一个模型顺时针摆放代码
时间: 2023-12-24 21:05:22 浏览: 22
可以通过three.js的旋转和平移操作实现让其他模型绕中间一个模型顺时针摆放。下面是一个简单的示例代码:
```javascript
// 创建场景
const scene = new THREE.Scene();
// 创建中间模型
const centerGeometry = new THREE.BoxGeometry(1, 1, 1);
const centerMaterial = new THREE.MeshBasicMaterial({ color: 0xff0000 });
const centerMesh = new THREE.Mesh(centerGeometry, centerMaterial);
scene.add(centerMesh);
// 创建其他模型
const numModels = 6; // 模型数量
const radius = 5; // 模型距离中心模型的距离
for (let i = 0; i < numModels; i++) {
const geometry = new THREE.BoxGeometry(1, 1, 1);
const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
const mesh = new THREE.Mesh(geometry, material);
// 计算模型位置
const angle = (Math.PI * 2) / numModels; // 每个模型之间的角度差
const x = Math.cos(angle * i) * radius;
const z = Math.sin(angle * i) * radius;
mesh.position.set(x, 0, z);
// 计算模型旋转角度
const rotationAngle = angle * i; // 旋转角度
mesh.rotateY(rotationAngle); // 绕Y轴旋转
scene.add(mesh);
}
```
上述代码将创建一个中间为红色立方体,其他为绿色立方体的场景,其他立方体沿着中心模型顺时针摆放,距离为5个单位。
你可以根据自己的需求调整模型数量、距离、颜色等参数。