用three.js在html5-webgl画布动画中组织对象

Organizing objects in html5 webgl canvas animation with three.js

本文关键字：动画对象 js three html5-webgl 布动画更新时间：2023-09-26

我想画一只3D猫（带动画），它只不过是一堆3D对象——椭球体、金字塔、球体等。我有两个问题：

1）有没有什么方法可以定义你自己复杂的几何3D对象，而不是标准的Three.js对象，比如Sphere、Cube。。。

2）当动画化整只猫时，我应该为每个对象定义一个动画函数吗？有没有办法把一些物体组合在一起？

对于第一个问题，我建议您阅读参数驱动建模，这将使您能够制作一致的复杂对象，而无需每次创建时都重新设计轮子。至于创建自定义对象，就像多段线是一个线的集合一样，通过标准线方法（以及特定于对象的方法）的迭代实现，您可以创建一个javascript对象，其中包含创建自定义形状所需的对象集合。这里有一个很好的webgl备忘单可以帮你一点忙。

问题二与我们上面描述复杂对象的方式有点相似，因为当您编写Cat对象渲染/动画函数时，您将根据每个对象处理动画（除了完整对象静态移动，想象一只猫在自动扶梯上）。再次强调，约束或参数驱动的设计将是您的救星，因为两个或多个对象部分叠加的事实并不意味着这些对象是显式链接的。

作为结束语，我建议研究clojurescript。这可能不是这种类型的工作所必需的，但lisp在CAD脚本世界中非常流行，从长远来看，你肯定会对自己有所帮助，至少要熟悉编码惯例——在这个项目中，你将要遇到的很多问题都会用各种编程语言来回答，但你可能会发现由在围栏两侧工作的人（cad/编程）编写的答案将用lisp编写。这是最后一个通用CAD论坛，它是所有CAD的绝佳资源。