Gibt es bei TWO JS Gegenstück zu DREI JS

Question

Ich komme gut voran und lerne ThreeJS als Schnittstelle zu WebGL. Danke Ihnen allen für Ihre vorherige Hilfe.

Ich entwickle einen neuen Ansatz für 3D Dynamics und möchte eine 3D-Komponente zum Lehrbuch. Beispiele finden Sie hier: http://eon.sdsu.edu/~impellus/DMF/

Sie sind nicht die besten, aber ich lerne.

Parallel möchte ich einige Animationen in 2D Statik und 2D INTERACTIVE Free Body Diagrams untersuchen. Das Ziel ist es, ein Objekt zu präsentieren, in Scheiben schneidet Aspekte davon entfernt und ersetzt den verworfenen Abschnitt mit Kräften (im Grunde: interaktiv durch Entfernen Kontakte Freischneiden zu konstruieren). Normalerweise würde ich Flash in Betracht ziehen, aber ich wurde davon abgeraten.

Sie können hier sehen, dass ich threejs verwendet, um ein 2D-Tutorial auf Stromlinien zu erstellen, Streichlinien, Bahnlinien:

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

Aber mein Gefühl ist, dass es nicht natürlich ist die Macht der threeJS für 2D zu verwenden interaktive Animationen

Also kann ich fragen, ob es eine Two JS-Version von Three JS gibt? Ich denke, nur die Frage zu stellen sollte ein Beweis sein für das, wonach ich suche, aber lassen Sie mich klarer sein. Ich bin auf der Suche nach einer Schnittstelle zu WebGL, die 2D-Animationen gewidmet ist. Ja, ich kann ThreeJS benutzen, aber ich denke, das wäre ein Fehler. Könnte mich jemand führen?

Answer 1

Versuchen Sie Ihr Glück mit dieser Javascript-Game-Engine-Liste:

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

Einige von ihnen auf 2D-Animationen mit Sprites oder Box2D Physik gewidmet sind.

Auch gibt es kommerzielle Produkte für Animationen 2D HTML5 zeichnen, wie http://www.sencha.com/products/animator/

Answer 2

ich auch die Verwendung einer 2D-Engine untersucht, aber am Ende verwendet nur Three.js. Wenn Sie Setup Ihre Kamera niemals in der Z-Richtung zu bewegen, und legen Sie alle visuellen Elemente auf der gleichen z = konstant Ebene dann ist es eine 2D-Engine.

Das einzige, was Sie ansprechen müssten, ist die z-Reihenfolge der Elemente in der Ebene. Eine Möglichkeit besteht darin, jedem Element einen etwas anderen Z-Wert zuzuweisen:

Wenn Sie z. B. auf der Ebene Z = 0 zeichnen, können Sie Element 1 für Z = 0 und Element 2 für Z = festlegen 0,0001, so Element 2 wird immer oben auf 1.

Ein besserer Weg, z Ordnung Element gezogen werden, um zu erreichen, wäre, den Motor zu hacken und die Zeichnungsreihenfolge für jedes Element festgelegt, um ein Element zu zwingen, zu ziehen vor einem anderen.

Ein weiteres Problem bei der Verwendung von three.js ist, dass es (zum Zeitpunkt des Schreibens) 2D-Sprites nicht gut verarbeitet.

Answer 3

pixi.js wurde erst kürzlich veröffentlicht - es ist eine 2D-Engine mit WebGL für die Leistung, aber mit einem 2D Canvas Fallback für die Kompatibilität. Ich habe es nicht selbst benutzt, aber es lohnt sich.

Answer 4

Check out Jono Brandel der two.js!

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

Nizza Demo hier: http://jonobr1.github.io/two.js/

Answer 5

Ich fand IvanK recht schnell und Funktion es viel mehr Funktionen als Pixijs vervollständigen haben.

Check it out (es webgl, Leinwand, svg Renderer mit automatischer Rück Unterstützung haben).

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

fand ich eine andere Bibliothek, fabricjs.com, sehr mächtig, aber langsam.