我一直在研究我的個人專案，使用 Three JS 作為我的主要 3d 物件渲染器，我想隨機生成具有指定范圍的隨機 x、y 和 z 坐標的球體，我能夠這樣做，但現在我需要這些隨機生成的物件中的每一個都沿其 xy 和 z 具有從 0.005 到 -0.005 范圍內的隨機旋轉速度。但不知道如何解決這個問題，任何幫助將不勝感激，他是我的隨機生成代碼，也是我已經處理過的影片 3d 物件的代碼：
function randomStar(){
const geometry = new THREE.SphereGeometry(0.25, 24, 24);
const starMaterial = new THREE.MeshBasicMaterial({color: 0xffffff, wireframe: false});
const star = new THREE.Mesh(geometry, starMaterial);
const [x,y,z] = Array(3).fill().map(() => THREE.MathUtils.randFloatSpread(150));
star.position.set(x,y,z);
star.rotation.x = 0.01;
star.rotation.y = 0.01;
scene.add(star);
}
Array(350).fill().forEach(randomStar);
function animate() {
requestAnimationFrame( animate );
torus.rotation.y = 0.005;
torus.rotation.x = 0.005
torusOne.rotation.x = 0.002
torusOne.rotation.y = 0.005;
torusTwo.rotation.y = 0.005;
torusTwo.rotation.x = 0.002
globe.rotation.y = 0.001
// controls.update();
renderer.render(scene, camera);
}
animate();
uj5u.com熱心網友回復：
您可以在創建時存盤旋轉的隨機值，并在每次渲染時為其設定影片。
star.userData.rx = Math.random() * 0.01 - 0.005;
star.userData.ry = Math.random() * 0.01 - 0.005;
star.userData.rz = Math.random() * 0.01 - 0.005;
...
animate() {
star.rotation.x = star.userData.rx;
star.rotation.y = star.userData.ry;
star.rotation.z = star.userData.rz;
}
在這里制作了一個代碼筆：https ://codepen.io/cdeep/pen/OJjVXqW
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/315326.html
標籤：javascript 动画片 三.js
上一篇：退出過渡完成時防止頁面上升