HTML 5 कैनवस vs. SVG
- पिछला पृष्ठ HTML5 SVG
- अगला पृष्ठ HTML मीडिया
Canvas और SVG दोनों ब्राउज़र में ग्राफिक्स बनाने की अनुमति देते हैं, लेकिन वे मूल रूप से अलग-अलग हैं。
SVG
SVG एक एक्सएमएल द्वारा 2D ग्राफिक्स का वर्णन करने वाली भाषा है。
SVG XML पर आधारित है, इसलिए SVG DOM में प्रत्येक एलीमेंट उपलब्ध है।आप किसी भी एलीमेंट पर जेस्क्रिप्ट इवेंट हैंडलर जोड़ सकते हैं。
SVG में, प्रत्येक बनाया गया ग्राफिक्स एक ऑब्जैक्ट के रूप में देखा जाता है।यदि SVG ऑब्जैक्ट की गुण समायोजित होती है, तो ब्राउज़र ऑटोमेटिक रूप से ग्राफिक्स को दोहराता है。
कैनवस
कैनवस, जेस्क्रिप्ट के द्वारा 2D ग्राफिक्स दूसरी बार बनाया जाता है。
कैनवस एक-एक पिक्सल पर रेंडरिंग करता है。
कैनवस में, जब चित्र दूसरी बार बनाया जाता है, तो यह ब्राउज़र की ध्यान नहीं रखता।यदि इसका स्थान बदलता है, तो पूरा सीन फिर से बनाया जाता है, जिसमें किसी भी ग्राफिक्स द्वारा छोड़े गए ऑब्जैक्ट शामिल हैं。
कैनवस और SVG का तुलना
नीचे दिए गए पटल में कैनवस और SVG के बीच कुछ अंतर दिखाया गया है。
कैनवस
- रेजोल्यूशन पर निर्भर
- इवेंट हैंडलर असमर्थित
- कमजोर टेक्स्ट रेंडरिंग क्षमता
- परिणाम चित्र को .png या .jpg फॉर्मेट में सहेजा जा सकता है
- चित्रद्रश्य पर विशेषज्ञ गेमों के लिए सबसे अच्छा, जिनमें कई ऑब्जैक्ट बार-बार पुनरावृत्त होते हैं
SVG
- रेजोल्यूशन पर निर्भर नहीं
- इवेंट हैंडलर समर्थन
- बड़े रेंडरिंग क्षेत्र वाले अनुप्रयोगों (जैसे गूगल मानचित्र) के लिए सबसे अच्छा
- जटिलता बढ़ने से रेंडरिंग की गति कम होगी (DOM का अतिरिक्त उपयोग करने वाले किसी भी अनुप्रयोग की गति नहीं तेज है)
- गेम अनुप्रयोग के लिए अनुचित
- पिछला पृष्ठ HTML5 SVG
- अगला पृष्ठ HTML मीडिया
