HTML5 画布动画效果 [关闭]

Question

请看看这个网站。 https://www.ethereum.org/

在后台播放了一个不错的动画。你会怎么称呼它，我该怎么做？

我仍在寻找有关该主题的任何示例和教程。到目前为止，我能找到的是这个。 Motion graphic typeface demo

我仍在修改代码，但没有任何明确的方向，我一无所获。

Answer 1

这里有 2 个基于 html5 Canvas 的方向供您探索。

这可以使用 3D 上下文 (WebGL) 在 html 画布中完成。

WebGL：

• 使用 html5 画布模拟 3D 对象。
• 允许您创建类似于示例链接的形状。
• 允许您将纹理应用到形状（或将形状保留为线框）。
• 允许您变换形状（移动、旋转、缩放）

这里是一个使用threeJS的例子，一个流行的3D库：

http://threejs.org/examples/#webgl_geometry_shapes

如果您打算部署的浏览器尚不支持 webgl，您可以使用 2D 上下文来模拟简单的 3D 图形：

这是一个使用 python 使用 2D 上下文模拟 3D 的示例：

http://codentronix.com/2011/04/20/simulation-of-3d-point-rotation-with-python-and-pygame/

Answer 2

在您链接的示例中，它不是画布，而是视频标签。