एसवीजी फ़ाइल क्या है?

एक SVG फ़ाइल एक स्केलर वेक्टर ग्राफ़िक्स फ़ाइल है जो एक छवि के प्रकटन का वर्णन करने के लिए XML आधारित पाठ प्रारूप का उपयोग करती है। स्केलेबल शब्द इस तथ्य को संदर्भित करता है कि एसवीजी को किसी भी गुणवत्ता को खोए बिना विभिन्न आकारों में बढ़ाया जा सकता है। ऐसी फ़ाइलों का टेक्स्ट-आधारित विवरण उन्हें रिज़ॉल्यूशन से स्वतंत्र बनाता है। स्केलेबिलिटी प्राप्त करने के लिए यह वेबसाइट बनाने और ग्राफिक्स प्रिंट करने के लिए सबसे अधिक उपयोग किए जाने वाले स्वरूपों में से एक है। हालांकि प्रारूप का उपयोग केवल द्वि-आयामी ग्राफिक्स के लिए किया जा सकता है। एसवीजी फाइलें क्रोम, इंटरनेट एक्सप्लोरर, फायरफॉक्स और सफारी सहित लगभग सभी आधुनिक ब्राउज़रों में देखी/खोली जा सकती हैं।

संक्षिप्त इतिहास

एसवीजी विनिर्देश 1999 से वर्ल्ड वाइड वेब कंसोर्टियम (W3C) द्वारा खुले मानक के रूप में उपलब्ध हैं। इससे पहले, 1998 तक छह अलग-अलग प्रारूपों में समान फ़ाइल प्रारूप विनिर्देश W3C को प्रस्तुत किए गए थे। 2011 में विनिर्देशों के लिए एक अद्यतन लागू किया गया था और इसे संस्करण 1.1 किया गया था। . 2016 में, SVG 2 को नए संस्करण के रूप में प्रकाशित किया गया था जिसमें SVG 1.1 के अतिरिक्त सुविधाएँ शामिल थीं।

फ़ाइल प्रारूप निर्दिष्टीकरण

SVG डॉक्यूमेंट ऑब्जेक्ट मॉडल (DOM) उन सभी विशिष्टताओं और इंटरफेस की नींव रखता है जो विनिर्देशों के विशेष वर्गों के अनुरूप होते हैं। SVG व्यूअर्स को W3C विनिर्देशों में परिभाषित SVG DOM इंटरफेस को लागू करना चाहिए। इसका DOM विभिन्न डेटा प्रकारों और तत्वों के लिए कई इंटरफेस को उजागर करता है।

एसवीजी आकार

एसवीजी में कुछ पूर्वनिर्धारित आकार तत्व हैं जिनका उपयोग डेवलपर्स द्वारा किया जा सकता है:

आयत
घेरा
दीर्घवृत्त
रेखा
पॉलीलाइन
बहुभुज
रास्ता

इन आकृतियों और विशिष्टताओं के आधार पर एसवीजी के कार्यात्मक क्षेत्र इस प्रकार हैं।

पथ - पथों का उपयोग सरल और मिश्रित आकार की रूपरेखाओं को दर्शाने के लिए किया जाता है। संचालन की प्रकृति को परिभाषित करने के लिए कोडिंग का उपयोग किया जाता है। उदाहरण के लिए, एम का उपयोग मूव टू के लिए किया जाता है, एल का उपयोग लाइन टू के लिए किया जाता है, जेड का उपयोग पथ को बंद करने के लिए किया जाता है और इसी तरह।

बुनियादी आकृतियाँ - सीधी-रेखा के पथ और जुड़े हुए सीधी-रेखा वाले खंडों (पॉलीलाइन) की श्रृंखला से बने पथ, साथ ही बंद बहुभुज, वृत्त और दीर्घवृत्त खींचे जा सकते हैं। आयत और गोल कोने वाले आयत भी मानक तत्व हैं।

टेक्स्ट - टेक्स्ट प्रस्तुतीकरण एक्सएमएल कैरेक्टर डेटा के रूप में व्यक्त किया जाता है जहां टेक्स्ट पर कई दृश्य प्रभाव लागू किए जा सकते हैं। विनिर्देश घुमावदार पथ के साथ द्विदिश पाठ, लंबवत पाठ और वर्णों को संभालने की अनुमति देते हैं।

पेंटिंग - आकृतियों को भरा जा सकता है और/या रंग, ढाल या पैटर्न के साथ रेखांकित किया जा सकता है, जिससे इसे अपारदर्शी बनाने या किसी भी हद तक पारदर्शिता रखने की क्षमता मिलती है। बहुभुज के शीर्ष पर दिखाई देने वाले तीर के सिरे या प्रतीकों जैसी रेखा-अंत की विशेषताएं मार्करों द्वारा दर्शाई जाती हैं।

रंग - एसवीजी विनिर्देश सभी दृश्यमान एसवीजी तत्वों पर रंग लागू करने की अनुमति देते हैं, या तो सीधे या भरण, स्ट्रोक और अन्य गुणों के माध्यम से। काले या नीले, हेक्स प्रतिनिधित्व, दशमलव या फॉर्म आरजीबी के प्रतिशत के रूप में निर्दिष्ट करने के लिए विभिन्न रंग कोडिंग का उपयोग किया जा सकता है।

ग्रेडिएंट और पैटर्न - SVG फ़ाइल में आकृतियों को ठोस रंग, ग्रेडिएंट या दोहराए जाने वाले पैटर्न से भरा या रेखांकित किया जा सकता है।

फ़िल्टर प्रभाव - यह वास्तव में ग्राफ़िक्स संचालन की एक श्रृंखला है जो संशोधित परिणाम उत्पन्न करने के लिए दिए गए स्रोत वेक्टर ग्राफ़िक पर लागू होते हैं।

इंटरएक्टिविटी - उपयोगकर्ता फोकस, माउस क्लिक, स्क्रॉल या छवि को ज़ूम करके एसवीजी फाइलों के साथ बातचीत कर सकते हैं। अन्तरक्रियाशीलता एसवीजी छवियों को उपरोक्त के रूप में कई अलग-अलग तरीकों से उपयोगकर्ताओं के साथ बातचीत करने देती है।

लिंकिंग - एसवीजी छवियों के लिए अन्य दस्तावेज़ों के लिए हाइपरलिंक होना संभव है। यह XML लिंकिंग लैंग्वेज या XLink के माध्यम से प्राप्त किया जाता है। यह विशिष्ट दृश्य अवस्थाएँ बनाने की अनुमति देता है जिनका उपयोग किसी विशिष्ट क्षेत्र को ज़ूम इन/आउट करने या दृश्य को किसी विशिष्ट तत्व तक सीमित करने के लिए किया जाता है।

स्क्रिप्टिंग - HTML के समान, SVG दस्तावेज़ के सभी पहलू स्क्रिप्ट का उपयोग करके हेरफेर करने के लिए सुलभ हैं। SVG DOM ऑब्जेक्ट SVG तत्व और विशेषता का उपयोग करके इसे प्राप्त करने के लिए मार्गदर्शन प्रदान करता है। स्क्रिप्ट स्क्रिप्ट टैग तत्वों में संलग्न हैं और आवश्यकतानुसार सूचक, कीबोर्ड या दस्तावेज़ घटनाओं के जवाब में चल सकते हैं।

एनीमेशन - डोम तत्व , तथा आपको एसवीजी सामग्री के लिए एनीमेशन शामिल करने देता है। बेशक, यह स्क्रिप्ट और बिल्ट-इन टाइमर का उपयोग किए बिना प्राप्त नहीं किया जा सकता है। ये एनिमेशन निरंतर हो सकते हैं और इन्हें लूप पर रखा जा सकता है और साथ ही उपयोगकर्ता घटनाओं का जवाब देते समय दोहराया जा सकता है।

फ़ॉन्ट्स - एसवीजी में पाठ बाहरी फ़ॉन्ट फ़ाइलों जैसे सिस्टम फ़ॉन्ट्स को संदर्भित कर सकता है। ऐसे फोंट के अभाव में, एसवीजी में टेक्स्ट आउटपुट में रेंडर नहीं किया जाएगा। इस तरह की फ़ाइल में आवश्यक ग्लिफ को एक फ़ॉन्ट के रूप में शामिल करके इसे दूर किया जा सकता है जिसे बाद में उपयोग करके प्रस्तुत किया जाता है तत्व।

उदाहरण

निम्नलिखित पंक्तियाँ दिखाती हैं कि SVG स्क्रिप्ट का उपयोग करके एक वृत्त का प्रतिनिधित्व कैसे किया जाता है।

<html>
<body>

<h1>My first SVG</h1>

<svg width#"100" height#"100">
  <circle cx#"50" cy#"50" r#"40" stroke#"green" stroke-width#"4" fill#"yellow" />
</svg>

</body>
</html>

कोड की निम्नलिखित पंक्तियाँ दिखाती हैं कि कैसे उपयोग करना है एसवीजी को टेक्स्ट रेंडर करने के लिए ब्लॉक।

<svg height#"30" width#"200">
  <text x#"0" y#"15" fill#"red">I love SVG!</text>
</svg>