कैसे पहचानें कि SVG में रास्टर इमेज है

हाँ, SVG में रास्टर इमेज हो सकती है। एक दस्तावेज़ में वेक्टर पाथ और पिक्सेल दोनों हो सकते हैं, या वह केवल PNG या JPEG का आवरण हो सकती है। .svg एक्सटेंशन आवरण का फ़ॉर्मैट बताता है, यह नहीं कि हर दिखता हिस्सा वेक्टर है।

भरोसेमंद जाँच वस्तुएँ और फ़ाइल स्रोत, दोनों देखना है। ज़ूम से समस्या दिख सकती है, लेकिन यह नहीं पता चलता कि ऐप पूर्वावलोकन को रास्टर बना रहा है या SVG में वास्तव में पिक्सेल रखे हैं।

WPF ऐप के लिए WPF में SVG निरूपण गाइड SVG स्रोत, WPF की अपनी ड्रॉइंग वस्तुएँ और बिटमैप के रूप में देने को अलग करती है। रास्टर प्रदर्शन को मूल फ़ाइल का प्रमाण मानने से पहले ऐप को क्या मिलता है, जाँचें।

SVG में क्या हो सकता है

SVG XML आधारित ग्राफ़िक्स फ़ॉर्मैट है और इसकी सामग्री केवल पाथ तक सीमित नहीं। SVG 2 एम्बेड सामग्री विनिर्देश <image> तत्व परिभाषित करता है जो पूरी संदर्भित फ़ाइल को आयत में रखता है। वह फ़ाइल PNG, JPEG या दूसरी SVG हो सकती है।

इससे 4 सामान्य संरचनाएँ बनती हैं:

मिश्रित सामग्री अपने आप गलत नहीं। नक्शे में लेबल और सीमाओं के लिए पाथ तथा छायांकित उपग्रह लेयर रास्टर हो सकती है। उत्पाद ग्राफ़िक फ़ोटो पर संपादन योग्य बैज रख सकता है। समस्या तब है जब रूपांतरण से संपादन योग्य पाथ की उम्मीद हो और दूसरे आवरण में पिक्सेल मिले हों।

जाँच 1: वस्तुएँ देखें

SVG Illustrator, Inkscape, Affinity Designer या Objects अथवा Layers पैनल वाले दूसरे संपादक में खोलें। रास्टर लगने वाला क्षेत्र चुनें।

• इमेज नाम वाली एक आयताकार वस्तु इमेज सामग्री का मजबूत प्रमाण है।
• आर्टवर्क की वास्तविक किनारियों पर दिखते नोड वेक्टर ज्यामिति बताते हैं।
• क्लिपिंग पाथ आयताकार इमेज छिपा सकता है, इसलिए निर्णय से पहले लेयर या वस्तु संरचना खोलें।
• कहीं और पाथ होने से पूरा दस्तावेज़ वेक्टर साबित नहीं होता। एक फ़ाइल में दोनों हो सकते हैं।

XML न पढ़ना चाहने वाले डिज़ाइनर के लिए यह उपयोगी है, लेकिन इसकी एक सीमा है: आयताकार <image> वस्तु दूसरी SVG संदर्भित कर सकती है। स्रोत जाँच बताती है कि वह वास्तव में क्या लोड करती है।

जाँच 2: SVG स्रोत देखें

प्रति बनाएं, फिर .svg सादा टेक्स्ट संपादक में खोलें। <image खोजें। इमेज तत्व न हो तो सामान्य एम्बेड इमेज व्यवस्था नहीं है। मिले तो उसका href पढ़ें।

एम्बेड PNG अक्सर ऐसे शुरू होती है:

<image href="data:image/png;base64,iVBORw0KGgo..." />

एम्बेड JPEG सामान्यतः data:image/jpeg;base64, से शुरू होती है। MDN का data-URL संदर्भ बताता है कि वैकल्पिक Base64 एन्कोडिंग के साथ डेटा सीधे URL में रखा जाता है। इस रूप में बहुत लंबा अपठनीय डेटा सामान्य है।

लिंक रास्टर कुछ ऐसी होती है:

<image href="photos/product-shot.png" />

वह PNG SVG के भीतर नहीं रखी है। दस्तावेज़ उस पाथ की अलग फ़ाइल पर निर्भर है। इमेज के बिना SVG स्थानांतरित या ईमेल करें तो आर्टवर्क गायब हो सकता है।

अंत में, यह रास्टर सामग्री का प्रमाण नहीं है:

<image href="icons/mark.svg" />

MDN पर <image> संदर्भ स्पष्ट बताता है कि तत्व रास्टर फ़ॉर्मैट या दूसरी SVG दिखा सकता है। वर्गीकृत करने से पहले मीडिया प्रकार या फ़ाइल एक्सटेंशन देखें।

SVG के भीतर या साथ 3 संरचनाएँ

एम्बेड और लिंक अलग समस्याएँ हैं

तस्वीर आयात करते समय Inkscape उसे लिंक या एम्बेड कर सकता है। इसकी तस्वीर आयात गाइड अंतर स्पष्ट करती है: लिंक से SVG छोटी रहती है लेकिन तस्वीर के स्थान पर निर्भर रहती है; एम्बेड करने से SVG स्व-पूर्ण होती है लेकिन आकार बढ़ता है।

फ़ाइल सौंपते समय यह अंतर जरूरी है:

• एम्बेड रास्टर: एक फ़ाइल के रूप में पोर्टेबल, लेकिन रिज़ॉल्यूशन की सीमा रहती है और अक्सर अपेक्षा से बड़ी होती है।
• लिंक रास्टर: अलग से अपडेट आसान, लेकिन फ़ोल्डर, कंप्यूटर, वेबसाइट या विक्रेता के बीच भेजने पर नाजुक।
• वेक्टर पाथ: ज्यामिति के रूप में संपादन योग्य, लेकिन तभी जब स्रोत पहले पाथ के रूप में ट्रेस या बनाया गया हो।

एम्बेड करना पैकेजिंग है, वेक्टराइज़ेशन नहीं। Base64 पिक्सेल को वक्र नहीं बनाता। स्टॉक आर्टवर्क तैयार कर रहे हों तो अतिरिक्त आर्टबोर्ड, संपादन और स्रोत जाँच के लिए Adobe Stock वेक्टर सबमिशन जाँच करें।

केवल ज़ूम पर्याप्त क्यों नहीं है

कई व्यूअर में अधिक ज़ूम पर संदिग्ध हिस्से में बड़े चौकोर पिक्सेल दिखें तो संभवतः रास्टर है। फिर भी व्यूअर अच्छी SVG को थंबनेल, कैनवास, प्रिंट पूर्वावलोकन या आयात कैश के लिए रास्टर बना सकता है। दूसरी ओर उच्च रिज़ॉल्यूशन एम्बेड PNG सामान्य ज़ूम पर चिकनी दिखकर दस्तावेज़ में छिप सकती है।

ज़ूम को लक्षण जाँच मानें, फिर वस्तुओं या स्रोत से पक्का करें। SVG में पिक्सेल क्यों दिखते हैं की व्यापक गाइड एम्बेड सामग्री, व्यूअर व्यवहार और छोटे आइकन प्रदर्शन अलग करती है। कैनवास ऐप में एक इमेज नोड को SVG स्रोत की समस्या मानने से पहले Konva इमेज और संपादन योग्य पाथ आयात की तुलना करें।

तय करें: रखें, दोबारा लिंक करें या बदलें

पिक्सेल जानबूझकर हों तो रास्टर रखें

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

पोर्टेबिलिटी समस्या हो तो दोबारा लिंक या एम्बेड करें

दूसरे कंप्यूटर पर लिंक इमेज गायब हो तो SVG और इमेज को समान सापेक्ष फ़ोल्डर संरचना में पैकेज करें या देने से पहले एम्बेड करें। इससे गायब संसाधन ठीक होता है। इमेज संपादन योग्य पाथ नहीं बनती।

पाथ का वादा था तो रास्टर बदलें

कन्वर्टर ने सपाट लोगो, आइकन या रेखाचित्र SVG में लपेट दिया हो तो मूल PNG या JPEG खोजें। मूल न मिले तो एम्बेड इमेज निकालें या उस वस्तु को उसके वास्तविक पिक्सेल आकार पर निर्यात करें। फिर इमेज वेक्टर पाथ में बदलें, आकृतियाँ देखें और <image> वस्तु को सत्यापित वेक्टर नतीजे से बदलें।

PerfectVector उपयुक्त सपाट आर्टवर्क को संपादन योग्य आकृतियों में दोबारा बनाने में उपयोगी है। यह लगातार बदलते रंगों वाली फ़ोटो को जादुई ढंग से छोटे, सटीक पाथ समूह में नहीं बदलता। फ़ोटो को रास्टर रखें, जब तक जानबूझकर सीमित रंगों की व्याख्या उद्देश्य न हो। स्वीकृत SVG से देने के लिए PNG प्रति चाहिए तो Sharp से सीधे अंतिम पिक्सेल आकार पर रेंडर करें; छोटी PNG बड़ी करने से उस SVG में एम्बेड किसी रास्टर इमेज का विवरण नहीं बढ़ता।

Scratch उपयोगकर्ता दूसरा आवरण निर्यात करने से पहले Convert to Vector बिटमैप क्यों नहीं ट्रेस करता देखें।

निर्यात में रास्टर बने प्रभाव दोबारा बनाएं

कुछ SVG मुख्यतः वेक्टर होती हैं लेकिन उनमें एक रास्टर छाया, धुंधलापन, बनावट या असमर्थित प्रभाव होता है। तय करें कि प्रभाव संपादन योग्य और पोर्टेबल रहना चाहिए या नहीं। समर्थित वेक्टर सुविधाओं से सरल प्रभाव दोबारा बनाएं, अंतिम रिज़ॉल्यूशन पर जानबूझकर रास्टर करें या हटाएं। नरम छाया ट्रेस करने से आम तौर पर बेहतर प्रभाव के बजाय अनियमित आकृतियाँ बनती हैं।

मिश्रित SVG सौंपने की जाँच

वेबसाइट, प्रिंटर, कटर या सहयोगी को फ़ाइल भेजने से पहले:

1. स्रोत में <image, data:image/, .png, .jpg और .jpeg खोजें।
2. पक्का करें कि हर संदर्भित संसाधन रास्टर, वेक्टर या अनुपस्थित होना चाहिए।
3. लिंक की गई फ़ाइलों का स्थान अस्थायी रूप से बदलकर SVG दोबारा खोलें ताकि टूटी निर्भरताएँ दिखें।
4. जरूरी आर्टवर्क चुनकर पक्का करें कि संपादन योग्य होने वाले हिस्से पाथ हैं।
5. अंतिम प्रदर्शन या प्रिंट आकार के सामने रास्टर के वास्तविक पिक्सेल माप देखें।
6. दी जाने वाली प्रति दूसरे ऐप में दोबारा खोलें।
7. संपादन से अधिक रूप जरूरी हो तो मूल स्रोत और रास्टर नमूना रखें।

कटिंग या निर्माण के लिए मशीन फ़ाइल से सजावटी रास्टर सामग्री हटाएं और कटिंग के लिए SVG अंतिम जाँच करें। कटर पाथ का अनुसरण करता है; एम्बेड फ़ोटो को कट कंटूर नहीं बनाता।

अक्सर पूछे जाने वाले सवाल

क्या SVG में PNG या JPEG हो सकती है? हाँ। SVG इमेज तत्व PNG या JPEG को अलग फ़ाइल के रूप में संदर्भित कर सकता है या उसका डेटा SVG के भीतर रख सकता है। रास्टर का मूल पिक्सेल आधारित व्यवहार रहता है।

क्या इमेज टैग हमेशा SVG में रास्टर इमेज होने का मतलब है? नहीं। इमेज तत्व दूसरी SVG भी संदर्भित कर सकता है। वर्गीकृत करने से पहले उसके href या पुराने xlink:href में मीडिया प्रकार, डेटा URL या फ़ाइलनाम देखें।

कैसे जानूँ कि रास्टर एम्बेड है या लिंक? एम्बेड इमेज का href आम तौर पर data:image से शुरू होता है, इसलिए उसके बाइट SVG के भीतर होते हैं। लिंक इमेज में images/photo.png जैसा पाथ या URL होता है और वह अलग संसाधन पर निर्भर है।

क्या मैं SVG से एम्बेड इमेज हटा सकता हूँ? हाँ। गैरजरूरी हो तो हटाएं, इच्छित रास्टर संसाधन से बदलें या उपयुक्त सपाट आर्टवर्क वेक्टराइज़ करके बने पाथ रखें। XML संपादन से पहले बैकअप रखें।

मेरी SVG में पाथ और इमेज दोनों क्यों हैं? यह मिश्रित SVG है। फ़ाइल जानबूझकर फ़ोटो और ऊपर की वेक्टर सामग्री जोड़ सकती है या निर्यातक ने प्रभाव रास्टर किया हो सकता है। बदलने से पहले देखें कि कौन-से हिस्सों में संपादन चाहिए।

स्रोत

1. W3C — SVG 2 एम्बेड सामग्री — <image> तत्व, उसका href और संदर्भित रास्टर या SVG संसाधन परिभाषित करता है।
2. MDN — SVG <image> — समर्थित इमेज सामग्री और आकार व्यवहार का व्यावहारिक संदर्भ।
3. Inkscape शुरुआती गाइड — तस्वीरें आयात करना — लिंक बनाम एम्बेड आयात तस्वीर और पोर्टेबिलिटी का अंतर समझाती है।
4. MDN — डेटा URL — SVG में इमेज डेटा रखने वाली सामान्य data: योजना बताता है।

जहाँ संपादन योग्य पाथ होने चाहिए थे, वहाँ बिटमैप आवरण मिला? मूल सपाट आर्टवर्क को वास्तविक वेक्टर में बदलें, SVG दोबारा खोलें और पक्का करें कि जरूरी वस्तुएँ अब आकृतियों के रूप में चुनी जाती हैं।