是否有两个JS对应的三个JS

Question

我正在学习ThreeJS作为WebGL的接口.谢谢你们以前的帮助.

我正在开发一种新的3D动态方法,并希望在教科书中使用3D组件.例如:http://eon.sdsu.edu/~impellus/DMF/

他们不是最好的,但我正在学习.

与此同时,我想研究2D Statics和2D INTERACTIVE Free Body Diagrams中的一些动画.目标是呈现一个对象,将其切片方面切除,并用力替换丢弃的部分(基本上:通过删除联系人以交互方式构建自由体图).通常情况下,我会考虑Flash,但我已经被建议反对它.

你可以在这里看到我使用threejs来创建关于流线,条纹和路径的2D教程:

http://eon.sdsu.edu/~impellus/FLOW/

但我的感觉是,使用threeJS的强大功能进行2D交互式动画是不自然的.

那么请问是否有三个JS的两个JS版本？我想只是问这个问题应该是我所寻找的证据,但让我更清楚.我正在寻找专门用于2D动画的webGL界面.是的,我可以使用threeJS,但我认为这是一个错误.有人可以指导我吗？

Answer 1

pixi.js刚刚发布 - 它是一个由WebGL支持的2D引擎,用于提高性能,但具有2D画布后备兼容性.我自己没有用它,但值得一试.

Answer 2

看看Jono Brandel的two.js!

https://github.com/jonobr1/two.js

很棒的演示:http: //jonobr1.github.io/two.js/

Answer 3

我还探讨了2D引擎的使用,但最后只使用了Three.js.如果您将相机设置为从不沿Z方向移动,并将所有视觉元素放置在相同的z =常数平面上,则它是2D引擎.

您唯一需要解决的是平面上元素的z顺序.一种方法是为每个元素分配略微不同的Z值:

例如,如果您在Z = 0平面上绘图,则可以将元素1设置为在Z = 0处绘制,将元素2设置在Z = 0.0001处,因此元素2将始终绘制在元素1的顶部.

实现z顺序的更好方法是破解引擎并为每个元素设置绘制顺序,以强制在另一个元素之前绘制一个元素.

使用three.js的另一个问题是(在编写本文时)它不能很好地处理2D​​精灵.

Answer 4

我发现IvanK非常快,功能齐全,它有比Pixijs更多的功能.

检查出来(它有webgl,canvas,svg渲染器,具有自动回退支持).

http://lib.ivank.net/?p=demos

我找到了另一个库,fabricjs.com,相当强大但很慢.

Answer 5

用这个 Javascript 游戏引擎列表试试你的运气：

https://github.com/bebraw/jswiki/wiki/Game-Engines

其中一些专门用于带有精灵或 Box2d 物理的​​ 2D 动画。

还有一些用于绘制 2D HTML5 动画的商业产品，例如http://www.sencha.com/products/animator/