2012-07-12 11 views
26

पर दो जेएस समकक्ष पर है, मैं वेबजीएल के इंटरफ़ेस के रूप में तीनजेएस सीखने के साथ-साथ अच्छी तरह से सीख रहा हूं। आपकी पिछली मदद के लिए सभी को धन्यवाद।क्या तीन जेएस

मैं 3 डी गतिशीलता के लिए एक नया दृष्टिकोण विकसित कर रहा हूं और पाठ्यपुस्तक में एक 3 डी घटक चाहता हूं। उदाहरण यहां पाए गए हैं: http://eon.sdsu.edu/~impellus/DMF/

वे सबसे अच्छे नहीं हैं, लेकिन मैं सीख रहा हूं।

समानांतर में, मैं 2 डी स्टेटिक्स और 2 डी इंटरैक्टिव फ्री बॉडी आरेखों में कुछ एनिमेशन की जांच करना चाहता हूं। लक्ष्य एक वस्तु पेश करना है, इसके टुकड़े टुकड़े करना और त्याग वाले खंड को बल के साथ प्रतिस्थापित करना (मूल रूप से: संपर्कों को हटाकर मुक्त शरीर आरेखों को अंतःक्रियात्मक रूप से बनाने के लिए)। आम तौर पर, मैं फ्लैश पर विचार करता हूं, लेकिन मुझे इसके खिलाफ सलाह दी गई है।

आप यहाँ देख सकते हैं कि मैं सुव्यवस्थित करता है, streaklines, pathlines पर एक 2 डी ट्यूटोरियल बनाने के लिए threejs प्रयोग किया है:

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

लेकिन मेरे लग रहा है कि यह स्वाभाविक 2 डी के लिए threeJS की शक्ति का उपयोग करने के लिए नहीं है इंटरैक्टिव एनिमेशन।

तो क्या मैं पूछ सकता हूं कि तीन जेएस का दो जेएस संस्करण है या नहीं? मुझे लगता है कि सिर्फ सवाल पूछना चाहिए कि मैं क्या देख रहा हूं, लेकिन मुझे और स्पष्ट होना चाहिए। मैं वेबजीएल के लिए एक इंटरफेस की तलाश में हूं जो 2 डी एनिमेशन के लिए समर्पित है। हां, मैं तीन जेएस का उपयोग कर सकता हूं, लेकिन मुझे लगता है कि यह एक गलती होगी। क्या कोई मुझे मार्गदर्शन कर सकता है?

उत्तर

2

इस जावास्क्रिप्ट खेल इंजन की सूची के साथ अपनी किस्मत का प्रयास करें:

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

उनमें से कुछ स्प्राइट या Box2D भौतिकी के साथ 2 डी एनिमेशन के लिए समर्पित कर रहे हैं।

इसके अलावा 2 डी एचटीएमएल 5 एनिमेशन ड्राइंग, जैसे http://www.sencha.com/products/animator/

9

मैं भी एक 2 डी इंजन का उपयोग का पता लगाया लेकिन अंत सिर्फ इस्तेमाल किया Three.js में के लिए व्यावसायिक उत्पादों रहे हैं। यदि आप अपने कैमरे को ज़ेड दिशा में कभी भी स्थानांतरित करने के लिए सेट नहीं करते हैं, और सभी दृश्य तत्वों को एक ही z = स्थिर विमान पर रखें तो यह 2 डी इंजन है।

केवल एक चीज जिसे आपको संबोधित करना होगा विमान पर तत्वों का z-order है। एक तरीका यह है कि प्रत्येक तत्व को थोड़ा अलग Z मान दिया जाता है:

उदाहरण के लिए यदि आप Z = 0 विमान पर चित्रित कर रहे हैं तो आप जेड = 0 पर तत्व 1 और Z = 0.0001, इसलिए तत्व 2 तत्व के शीर्ष पर हमेशा खींचा जाएगा 1.

जेड-ऑर्डर प्राप्त करने का एक बेहतर तरीका इंजन को हैक करना होगा और प्रत्येक तत्व के लिए ड्राइंग ऑर्डर सेट करना होगा ताकि एक तत्व को खींचा जा सके एक से पहले।

तीन.जेएस का उपयोग करने के साथ ही एक और समस्या यह है कि (लिखने के समय) यह 2 डी sprites बहुत अच्छी तरह से संभाल नहीं करता है।

28

pixi.js हाल ही में जारी किया गया था - यह प्रदर्शन के लिए वेबजीएल द्वारा समर्थित 2 डी इंजन है, लेकिन संगतता के लिए 2 डी कैनवास फ़ॉलबैक के साथ। मैंने इसे स्वयं नहीं इस्तेमाल किया है लेकिन यह जांचने लायक है।

+6

एपीआई भी तीन.जेएस से बहुत प्रेरित है। – mrdoob

+0

ivank.js अधिक पूर्ण है, यह वेबग्ल (कैनवास या डोम पर फ़ॉलबैक) का भी उपयोग करता है, मैं अभी इसका परीक्षण कर रहा हूं और इसमें बहुत से ईवेंट (क्लिक, ड्रैग) और वैक्टर हैं। यह और अधिक पूरा लगता है। –

+0

फिर भी एक और 2 डी कैनवास गेम/ऐप इंजन, लेकिन यह स्पष्ट रूप से अभी जारी किया गया है और एक (बहुत) त्वरित रूप से यह उपयोग करने के लिए अच्छा और सरल लगता है: iioengine.com – poshaughnessy

18

जोनो ब्रैंडेल की दो.जेएस देखें!

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

नाइस यहाँ डेमो: http://jonobr1.github.io/two.js/

+3

अच्छा एक लेकिन पिक्सी की तुलना में बहुत धीमी है, और ivank –

+0

कैंट छवियों का उपयोग करें – Prozi

5

मैं IvanK काफी तेजी से और विशेषता यह Pixijs से बहुत अधिक विशेषताएं हैं पूरा पाया।

इसे जांचें (इसमें वेबलॉग, कैनवास, स्वचालित फ़ॉलबैक समर्थन के साथ svg renderers हैं)।

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

मैं एक और पुस्तकालय, fabricjs.com, काफी शक्तिशाली लेकिन धीमी गति से मिल गया।

संबंधित मुद्दे