Есть ли у ДВА JS аналог ТРИ JS
Я хорошо изучаю ThreeJS как интерфейс для WebGL. Спасибо всем за вашу предыдущую помощь.
Я разрабатываю новый подход к 3D-динамике и хотел бы добавить 3D-компонент в учебник. Примеры можно найти здесь: http://eon.sdsu.edu/~impellus/DMF/
Они не самые лучшие, но я учусь.
Параллельно я хотел бы исследовать некоторые анимации в 2D Statics и 2D INTERACTIVE Free Body Diagrams. Цель состоит в том, чтобы представить объект, отделить его от части и заменить отброшенный участок силами (в основном: для интерактивного построения диаграмм свободных тел путем удаления контактов). Обычно, я бы рассмотрел Flash, но мне посоветовали против этого.
Здесь вы можете видеть, что я использовал threejs для создания двумерного учебника по линиям тока, линиям и линиям:
http://eon.sdsu.edu/~impellus/FLOW/
Но я чувствую, что не вполне естественно использовать возможности ThreeJS для 2D-интерактивной анимации.
Могу ли я спросить, есть ли версия Two JS для Two JS? Я думаю, что просто вопрос должен быть доказательством того, что я ищу, но позвольте мне быть более ясным. Я ищу интерфейс для webGL, который посвящен 2D-анимации. Да, я могу использовать ThreeJS, но я думаю, что это будет ошибкой. Может ли кто-нибудь направить меня?
6 ответов
pixi.js был выпущен совсем недавно - это 2D-движок, поддерживаемый WebGL для повышения производительности, но с резервной версией 2D-холста для совместимости. Я не использовал это сам, но это стоит проверить.
Посмотрите на Jono Brandel's two.js!
https://github.com/jonobr1/two.js
Хорошая демонстрация здесь: http://jonobr1.github.io/two.js/
Я также исследовал использование 2D движка, но в конце концов использовал Three.js. Если вы установите камеру так, чтобы она никогда не двигалась в направлении Z, и поместили все визуальные элементы в одну плоскость z = постоянной, то это 2D-движок.
Единственное, к чему вам нужно обратиться - это z-порядок элементов на плоскости. Один из способов сделать это - присвоить каждому элементу немного другое значение Z:
Например, если вы рисуете на плоскости Z = 0, вы можете установить элемент 1 для рисования в Z = 0 и элемент 2 в Z = 0,0001, поэтому элемент 2 всегда будет рисоваться поверх элемента 1.
Лучшим способом достижения z-порядка было бы взломать движок и установить порядок рисования для каждого элемента, чтобы заставить один элемент рисоваться раньше другого.
Еще одна проблема с использованием three.js заключается в том, что (на момент написания) он не очень хорошо обрабатывает 2D-спрайты.
Я нашел IvanK довольно быстрым и полным набором функций, он имеет гораздо больше возможностей, чем Pixijs.
Проверьте это (в нем есть рендереры webgl,canvas,svg с автоматической поддержкой отката).
я нашел другую библиотеку, fabricjs.com, довольно мощную, но медленную.
Испытайте свою удачу с этим списком игрового движка Javascript:
https://github.com/bebraw/jswiki/wiki/Game-Engines
Некоторые из них посвящены 2D-анимации со спрайтами или физикой Box2d.
Также есть коммерческие продукты для рисования 2D-анимации HTML5, такие как http://www.sencha.com/products/animator/
Если вы ищете 2D-визуализацию, лучшим вариантом будет D3 или Two.js:
Иногда вам нужен простой нож, чтобы смазать вещи. Three.js очень похож на бензопилу, когда дело касается просто плавной графики. Это больше ориентировано на 3 измерения.