यदि आपको HTML5 कैनवास पर विभिन्न परतों पर काम करने की आवश्यकता है तो इसे करने का सबसे अच्छा तरीका क्या है? मुझे लगता है कि कुछ लोग स्थिति का उपयोग कर एक दूसरे के ऊपर कई कैनवस ढेर करने का फैसला करते हैं: पूर्ण। क्या यह सबसे अच्छा तरीका है?एचटीएमएल 5 कैनवास में परत करने का सबसे अच्छा तरीका?
व्यक्तिगत रूप से, मैं एक दूसरे के शीर्ष पर कैनवास को ढेर नहीं करता। एक कैनवास वास्तव में केवल एक बिटमैप है जो आपको आवश्यक सभी पिक्सल प्रदर्शित करता है, इसलिए आपको केवल अधिकांश मामलों के लिए एक की आवश्यकता होनी चाहिए।
मैं विभिन्न ऑब्जेक्ट्स प्रबंधित करने में आपकी सहायता के लिए लाइब्रेरी का उपयोग करने का सुझाव दूंगा। मैंने पाया है कि ग्रांट स्किनर की EaselJS काम करने के लिए एक हवा है।
यह लाइब्रेरी आपको ऑब्जेक्ट्स को आसानी से समूहबद्ध करने और उन्हें कैनवास में जोड़ने की सुविधा देती है, इससे ऑब्जेक्ट्स पर क्लिक कैप्चर करने के लिए माउस श्रोताओं को जोड़ने में भी मुश्किल होती है, जो कुछ ऐसा है जो आपको उपयोग करते समय करने के लिए बहुत सारे कोड लिखना होगा पुस्तकालय के बिना कैनवास।
EaselJS पर भी दस्तावेज़ीकरण और उदाहरण हैं।
संपादित करें:
यहाँ container समूह वस्तुओं के लिए इस्तेमाल किया के बारे में किए गए दस्तावेज़ों से एक उद्धरण है।
एक कंटेनर एक घोंसलाशील डिस्प्ले सूचियां है जो आपको यौगिक प्रदर्शन तत्वों के साथ काम करने की अनुमति देती है। उदाहरण के लिए आप एक व्यक्ति कंटेनर में हाथ, पैर, धड़ और सिर बिटमैप्स को एक साथ समूहित कर सकते हैं, और उन्हें एक समूह के रूप में बदल सकते हैं, जबकि अभी भी एक-दूसरे के सापेक्ष अलग-अलग हिस्सों को स्थानांतरित करने में सक्षम हैं। कंटेनरों के बच्चों में उनके ट्रांसफॉर्म और अल्फा गुण होते हैं जो उनके मूल कंटेनर के साथ मिलते हैं। उदाहरण के लिए, x = 100 और अल्फा = 0.5 के साथ एक आकार, x = 50 और अल्फा = 0.7 के साथ कंटेनर में रखा गया है x = 150 और अल्फा = 0.35 पर कैनवास में प्रस्तुत किया जाएगा। कंटेनर के ऊपर कुछ ओवरहेड होता है, इसलिए आपको आम तौर पर एक बच्चे को पकड़ने के लिए कंटेनर नहीं बनाना चाहिए।
महान अंतर्दृष्टि, मैं EaselJS का उपयोग कर रहा हूं लेकिन मुझे समूहकरण शब्द से अवगत नहीं था। मैं इसे और धन्यवाद में देख लूंगा –