2012-10-15 37 views
10

player stackक्या कोई जावास्क्रिप्ट भौतिकी लाइब्रेरी है जो एचटीएमएल तत्वों जैसे कैनवास की बजाय divs के साथ काम करती है?

मैं एक खेल है जहाँ खिलाड़ियों के आसपास गिने टुकड़े ले जाने के कितने करीब वे टुकड़ों में से एक जीत हाथ का संग्रह परिष्करण के लिए कर रहे का ट्रैक रखने के लिए एक सरल स्टैक पर काम कर रहा हूँ।

वर्तमान में मैं jQuery UI के ड्रैगगेबल और ड्रॉपपेबल के साथ गया था। यह आसानी से शुरू करने के लिए अच्छा है लेकिन टुकड़े एक समय में केवल एक टुकड़ा स्थानांतरित किया जा सकता है: http://cssdeck.com/labs/cowmmudd/4

  • मैं jQuery UI का उपयोग करने के बजाय वास्तविक जावास्क्रिप्ट भौतिकी लाइब्रेरी में चारों ओर चलने वाले आउटसोर्स आउटसोर्स करना चाहता हूं। (ताकि जब कोई ऊपरी पंक्ति में नीली 4 को हर तरफ छोड़ देता है, तो वह उस पंक्ति पर सभी टुकड़ों को एक साथ रखता है।)
  • मैं अपने टुकड़ों का प्रतिनिधित्व करने के लिए सामान्य HTML तत्वों का उपयोग जारी रखना चाहता हूं क्योंकि ये शैली के लिए आसान हैं और के बारे में कारण (सभी जावास्क्रिप्ट भौतिकी पुस्तकालयों मैं उपयोग canvas पर एक नज़र ले लिया है, लेकिन मैं ते ही हासिल करना चाहते हैं के रूप में गूगल एक बार किया था: http://mrdoob.com/projects/chromeexperiments/google-gravity/)

किसी प्लेसमेंट और सामान्य की टक्कर को नियंत्रित करने का एक न्यूनतम उदाहरण प्रदान कर सकते हैं नहीं-, इन-कैनवास एचटीएमएल तत्वों का सबसे अच्छा जावास्क्रिप्ट भौतिकी पुस्तकालय का उपयोग कर वे जानते हैं?

+0

क्या आप वाकई एक अतिरिक्त बाहरी पुस्तकालय का उपयोग कर रहे जाने का रास्ता है? छोड़ने पर एक ही ऊंचाई में टाइलों की जांच करने के बारे में क्या और यदि उन्हें स्थानांतरित किया जा सकता है तो उन्हें वहां एनिमेट कर दिया जा सकता है? –

+1

@ बेंजामिनग्रेनबाम मैं बहुत सारे अनगिनत कोड लिखना नहीं चाहता क्योंकि मैं भौतिकी और गणित और ज्यामिति में एक पूर्ण नोब हूं, आप इसका नाम देते हैं। मैं खेल वस्तुओं के गुणों की घोषणा करना चाहता हूं और उचित पुस्तकालय मेरे लिए टकराव और नियुक्ति का ख्याल रखता हूं। –

+1

बॉक्स 2 डी के जेएस संस्करण में कैनवास का उपयोग करके डीबग रेंडरर है, लेकिन यह सिर्फ डिफ़ॉल्ट है। आप वस्तुओं को किसी भी तरह से प्रस्तुत कर सकते हैं - सिमुलेशन और ड्राइंग स्वतंत्र हैं। –

उत्तर

4

सबसे सरल उदाहरण मैं अब तक पाया है: http://bl.ocks.org/3411189

अद्यतन: मेरी टुकड़े के लिए एक साधारण अनुकूलन: http://cssdeck.com/labs/fe3z2cfx/6

+1

क्या इनमें से कोई भी लिंक चेतावनी के बिना हटाने के अधीन है, या वे स्थायी जुड़नार हैं? ज्यादातर मामलों में, आप अपने उत्तर में वास्तविक कोड चिपकाने और लिंक का संदर्भ देने से बेहतर होते हैं। अन्यथा, संसाधन अचानक गायब होने पर आपका उत्तर बेकार हो जाता है। यह भी देखें http://meta.stackexchange.com/questions/8231/are-answers-that-just-contain-links- कहीं और-really-good-answers –

+0

@RobertHarvey: आप सही हैं, मैं cssdeck को संपादित कर दूंगा आपके सुझाव! –

+0

@ रॉबर्ट हार्वे: मैंने दो छोटे जेएस स्निपेट एम्बेड करने और उनके मूल स्रोतों में संदर्भ जोड़ने के लिए अपना उत्तर अपडेट किया है। –