用tree.js的动画不接受我的圆环

发布于 2025-02-06 09:34:52 字数 610 浏览 1 评论 0原文

我是三分的新手,无法弄清为什么此动画不接受圆环作为参数。如果不设置“ torustobemaved”作为参数,它的工作原理就完全可以。

const geometry = new THREE.TorusGeometry(25, 0.2, 26, 100);
const material = new THREE.MeshStandardMaterial({ color: 0xccaa55 });
const torus = new THREE.Mesh(geometry, material);
torus.position.set(-15, -15, -15);

scene.add(torus);

function animate(torusToBeMoved) {
  requestAnimationFrame(animate(torusToBeMoved));

  torusToBeMoved.rotation.x += 0.01;
  torusToBeMoved.rotation.y += 0.005;
  torusToBeMoved.rotation.z += 0.01;
  controls.update();

  renderer.render(scene, camera);
}

animate(torus);```

I am new to Three.js and cannot work out why this animation does not accept the torus as a parameter. Without setting 'torusToBeMoved' as a parameter it works just perfectly fine..

const geometry = new THREE.TorusGeometry(25, 0.2, 26, 100);
const material = new THREE.MeshStandardMaterial({ color: 0xccaa55 });
const torus = new THREE.Mesh(geometry, material);
torus.position.set(-15, -15, -15);

scene.add(torus);

function animate(torusToBeMoved) {
  requestAnimationFrame(animate(torusToBeMoved));

  torusToBeMoved.rotation.x += 0.01;
  torusToBeMoved.rotation.y += 0.005;
  torusToBeMoved.rotation.z += 0.01;
  controls.update();

  renderer.render(scene, camera);
}

animate(torus);```

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

原谅我要高飞 2025-02-13 09:34:54

由于您将函数的返回值作为参数传递,而不是将函数传递为参数,因此您遇到了“最大调用堆栈大小超过”错误。使用回调作为参数应解决问题:

const animate = (torusToBeMoved) => {
  torusToBeMoved.rotation.x += 0.01;
  torusToBeMoved.rotation.y += 0.005;
  torusToBeMoved.rotation.z += 0.01;

  controls.update();
  renderer.render(scene, camera);

  requestAnimationFrame(() => animate(torusToBeMoved));
}

You are running into a "Maximum call stack size exceeded" error since you are passing the return value of the function as parameter instead of passing the function as parameter. Utilizing a callback as parameter should solve the issue:

const animate = (torusToBeMoved) => {
  torusToBeMoved.rotation.x += 0.01;
  torusToBeMoved.rotation.y += 0.005;
  torusToBeMoved.rotation.z += 0.01;

  controls.update();
  renderer.render(scene, camera);

  requestAnimationFrame(() => animate(torusToBeMoved));
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文