如何使用Canvas制作3D动画

Question

我有Canvas 2D上下文的背景，但我想执行像this one这样的3D动画，Three.js库是做这种动画的最佳选择吗？你能指点我一些有用的教程或文档吗？提前完成。

Answer 1

这是最常见的选择之一。

由于WebGL在不需要库的情况下启用OpenGL，您可能只使用Vanilla JS来实现它，但这会更难，因为WebGL不会对原始和原始OpenGL提供更多的改进。

除了three.js之外，您还可以尝试GLGE或PhiloGL但是Three.js是最受欢迎的，如果您没有特殊要求，我建议您使用它。

Answer 2

您链接的演示看起来像是使用名为Clay.js的画布库。直到现在我还没有亲自听过的。对于画布中的3D最流行的一个，我知道它就像你已经提到的Three.js。它还具有支持webGL的优点（基于浏览器的openGL变体）。

Three.js限制documentation和some examples，但在某些书籍之外，您可能会购买并不是很多。你基本上需要潜入并开始编码。以下是一些可以帮助您入门的在线资源（不一定全部关注THREE.js）：

http://aerotwist.com/tutorials/getting-started-with-three-js/

http://learningthreejs.com/

http://learningwebgl.com/blog/

为了更容易使用THREE.js，JérômeEtienne创建了一个名为tQuery的项目，您可以将其视为有点像jQuery。一个包装，让你的手更容易弄脏。这是一个video，他在那里展示了如何在10分钟内创建一个webGL游戏。