PerfectVector
लेखक: Irene Kim

Potrace से PNG को SVG बनाएँ: अल्फ़ा और छिद्र सँभालें

PNG का अल्फा चैनल तैयार करने के बाद इसे Potrace के साथ परिवर्तित करें। परीक्षण किए गए पीजीएम वर्कफ़्लो का पालन करें, थ्रेसहोल्ड की तुलना करें, और SVG की पृष्ठभूमि और आंतरिक छिद्रों की जांच करें।

9 मिनट का पठन
इस पेज पर

Potrace के साथ PNG को SVG में बदलने के लिए, पहले एक ग्रेस्केल बिटमैप तैयार करें, फिर इसे potrace --svg से ट्रेस करें। पारदर्शी पिक्सेल पर गहरे रंग की कलाकृति के लिए, बिटमैप को सहेजने से पहले छवि को एक सफेद मैट पर मिश्रित करें। SVG स्वीकार करने से पहले दहलीज वाली आकृतियों और उनके आंतरिक उद्घाटन का निरीक्षण करें।

मानक Potrace 1.16 सीधे PNG के बजाय पीबीएम, पीजीएम, पीपीएम और बीएमपी को पढ़ता है। इसका आधिकारिक मैनुअल एक मोनोक्रोम ट्रेसिंग ऑपरेशन का वर्णन करता है: मध्यवर्ती रंग काले या सफेद हो जाते हैं। नीचे दिया गया वर्कफ़्लो PNG के निरंतर अल्फा मानों को संरक्षित करने के बजाय खाली क्षेत्रों के साथ ठोस ज्यामिति बनाता है।

यदि आप अपने पास पहले से मौजूद छवि के लिए ब्राउज़र वर्कफ़्लो पसंद करते हैं, तो PerfectVector छवि-से-पथ रूपांतरण और एक निःशुल्क पूर्वावलोकन प्रदान करता है। अपनी स्वयं की छवि से निःशुल्क शुरुआत करें, फिर स्रोत के साथ उसके सिल्हूट, छोटे उद्घाटन और रंगों की तुलना करें। संपादन या निर्यात से पहले परिणाम को अनलॉक करें। जब आप स्पष्ट प्रीप्रोसेसिंग और दोहराने योग्य कमांड सेटिंग्स चाहते हैं तो स्थानीय Potrace रेसिपी उपयोगी रहती है।

अपनी इमेज पर आज़माएँ
पूरा टूल खोलें
यह मुफ़्त है। इमेज डालें और बिना साइन-अप किए अपने वेक्टर का प्रीव्यू देखें।

ट्रेसिंग से पहले आपको क्या चाहिए

एक स्थापित Potrace निष्पादन योग्य, Python 3 के साथ Pillow और मूल PNG का उपयोग करें। इस नुस्खे का अभ्यास Potrace 1.16 और Pillow 11.3.0 के साथ किया गया था। इनपुट की एक प्रति रखें और एक अलग फ़ोल्डर में काम करें ताकि प्रत्येक थ्रेशोल्ड वेरिएंट का एक अलग फ़ाइल नाम हो।

शुरुआती केस हल्के या पारदर्शी पृष्ठभूमि पर एक गहरे रंग का लोगो, आइकन या ड्राइंग है। यदि आपका विषय प्रकाश पर अंधेरा है, तो इस नुस्खे को लागू करने से पहले तय करें कि छवि को कैसे उलटा करना है या अन्यथा तैयार करना है। इंटरैक्टिव संपादक वर्कफ़्लो के लिए, Inkscape ट्रेस बिटमैप देखें।

मैट एक ठोस पृष्ठभूमि है जिसका उपयोग ट्रेसिंग से पहले पारदर्शी पिक्सल को हल करने के लिए किया जाता है। एक थ्रेसहोल्ड ब्राइटनेस कटऑफ है जो तैयार छवि को अग्रभूमि और पृष्ठभूमि में विभाजित करता है। वे विकल्प समोच्च के SVG ज्यामिति बनने से पहले होते हैं।

1. बिटमैप को सहेजने से पहले पारदर्शिता का समाधान करें

PNG रंग और अपारदर्शिता को अलग-अलग संग्रहीत करता है। अल्फ़ा चैनल प्रत्येक पिक्सेल की अपारदर्शिता का वर्णन करता है। PNG विनिर्देश इस प्रतिनिधित्व की व्याख्या करता है; एक पूरी तरह से पारदर्शी पिक्सेल अभी भी RGB मान ले सकता है। अल्फ़ा चैनल को छोड़ने से उन पिक्सेल को उस सफ़ेद पृष्ठभूमि पर संयोजित नहीं किया जाता है जिसे आपने छवि व्यूअर में देखा होगा।

गहरे निशान के लिए, छवि को जानबूझकर सफेद रंग के ऊपर रखें। यह Python स्निपेट artwork.png खोलता है, इसे एक समान आकार की सफेद छवि पर संयोजित करता है, उस परिणाम को ग्रेस्केल में परिवर्तित करता है और artwork.pgm को सहेजता है:

from PIL import Image
 
src = Image.open("artwork.png").convert("RGBA")
matte = Image.new("RGBA", src.size, "white")
gray = Image.alpha_composite(matte, src).convert("L")
gray.save("artwork.pgm")

Pillow का alpha_composite दस्तावेज़ दूसरी छवि को पहले की तुलना में मिश्रित के रूप में परिभाषित करता है। यहां दोनों छवियों के आयाम और RGBए मोड मेल खाते हैं।

ट्रेसिंग से पहले तैयार पीजीएम खोलें। इसकी बाहरी पृष्ठभूमि सफ़ेद होनी चाहिए, इसका इच्छित अग्रभाग गहरा होना चाहिए, और इसके महत्वपूर्ण अंतराल दिखाई देने चाहिए। इस स्तर पर एक काला आयत एक पूर्व-प्रसंस्करण समस्या है; SVG भरण नियमों को बाद में बदलने से उस उद्घाटन को पुनर्प्राप्त नहीं किया जा सकता जो ट्रेसर तक कभी नहीं पहुंचा।

चित्रण
PNG पारदर्शिता पर एक काली अंगूठी का चित्रण, एक सफेद मैट पर संयोजित, फिर एक खुले केंद्र के साथ SVG ज्यामिति के रूप में दर्शाया गया
अग्रभूमि ज्यामिति को चुनने से पहले रैस्टर के पारदर्शी पिक्सल को एक जानबूझकर मैट के विरुद्ध हल करें। अंतिम उद्घाटन से डिस्प्ले पृष्ठभूमि दिखाई देती है।

2. तैयार पीजीएम का पता लगाएं

इसे artwork.pgm वाले फ़ोल्डर में चलाएँ:

potrace artwork.pgm --svg --blacklevel 0.5 --turdsize 2 --output artwork.svg

--blacklevel 0.5 ग्रेस्केल कटऑफ चुनता है। --turdsize 2 Potrace के डिफ़ॉल्ट छोटे-धब्बेदार दमन को स्पष्ट रखता है। जब आप सेटिंग बदलते हैं तो नए आउटपुट नाम का उपयोग करें, फिर अपने संदर्भ को बार-बार ओवरराइट करने के बजाय फ़ाइलों की तुलना करें।

एक समय में एक नियंत्रण बदलें:

नियंत्रणक्या समीक्षा करें
--blacklevelक्या हल्के निशान अग्रभूमि बन जाते हैं और संकीर्ण उद्घाटन खाली रह जाते हैं
--turdsizeक्या छोटी पृथक आकृतियाँ शोर हैं या जानबूझकर विवरण हैं
--alphamaxकोने का उपचार; अपने नाम के बावजूद, यह कोई अपारदर्शिता नियंत्रण नहीं है

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

दो मूल परीक्षण छवियों ने क्या दिखाया

हमने दो नियंत्रित 256 बनाए × 256 PNG और उपरोक्त प्रीप्रोसेसिंग और Potrace कमांड चलाए। एक एक काली अंगूठी थी जिसके बाहर और अंदर पारदर्शी पिक्सेल थे। दूसरा एक संकीर्ण भूरे रंग के काउंटर के साथ एक अपारदर्शी काला निशान था, निशान के भीतर संलग्न उद्घाटन। हमने एक रेंडरर के साथ उत्पन्न SVG का निरीक्षण किया और उनके केंद्र और बाहरी पारदर्शिता की जांच की।

इनपुट और तैयारीSVG परिणाम का अवलोकन किया
पारदर्शी रिंग, ग्रेस्केल रूपांतरण से पहले अल्फा को हटा दिया गयाएक भरा हुआ काला कैनवास; बाहरी और इच्छित उद्घाटन अग्रभूमि बन गया
वही अंगूठी, जिसे ग्रेस्केल रूपांतरण से पहले सफेद रंग में संयोजित किया गया थाबाहर और केंद्र खाली थे; अंगूठी भरी रही
संकीर्ण ग्रे काउंटर, सफेद मिश्रित, ब्लैकलेवल 0.5काउंटर खुला रहा
वही तैयार काउंटर छवि, ब्लैकलेवल 0.8काउंटर भर गया

रिंग नियंत्रण के अदृश्य पिक्सेल में काले RGB मान होते हैं। अल्फ़ा को नज़रअंदाज करने से वे मान दहलीज पर उजागर हो गए। सफ़ेद-मिश्रित संस्करण ने उन्हें पहले सफ़ेद में हल किया। यह उस नमूने के ब्लैक बॉक्स की व्याख्या करता है; यह दावा नहीं है कि प्रत्येक PNG एक ही तरह से विफल हो जाएगी।

काउंटर परीक्षण ने इनपुट और अन्य सेटिंग्स को स्थिर रखा। केवल दहलीज बदल गई। इसके परिणाम से पता चलता है कि गहरा दिखने वाला निशान स्वचालित रूप से बेहतर निशान क्यों नहीं होता है। सबसे भारी सिल्हूट वाली सेटिंग चुनने के बजाय उस सुविधा का निरीक्षण करें जिसकी आपको आवश्यकता है।

ये दो मूल फिक्स्चर के डिजिटल चेक थे, उनके SVG आउटपुट में कोई एम्बेडेड रास्टर छवि नहीं थी। हमने Potrace की गुणवत्ता की तुलना PerfectVector से नहीं की, फ़ाइलों को कटर में आयात नहीं किया या भौतिक परिणाम का परीक्षण नहीं किया।

3. सहेजे गए SVG में छेद और पृष्ठभूमि की जाँच करें

SVG को एक विपरीत पृष्ठभूमि पर रखें। वह पृष्ठभूमि बाहरी क्षेत्र और प्रत्येक इच्छित उद्घाटन दोनों में दिखनी चाहिए। सफ़ेद रंग एक सफ़ेद पन्ने पर एक छेद जैसा हो सकता है, इसलिए केवल थंबनेल ही अपर्याप्त है।

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

इसके लिए सहेजी गई फ़ाइल की जाँच करें:

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

यदि केवल पृष्ठभूमि गलत दिखती है, तो प्रत्येक सफेद वस्तु को हटाने से पहले पारदर्शी SVG पृष्ठभूमि निदान का उपयोग करें। यदि कोई छोटी विशेषता वास्तव में स्रोत से अनुपस्थित है, तो एक बड़े मूल का उपयोग करें या उस विवरण को फिर से बनाएं। स्रोत-गुणवत्ता मार्गदर्शिका उस सीमा की व्याख्या करती है।

जब यह मोनोक्रोम वर्कफ़्लो फिट बैठता है

Potrace एक ऐसे निशान में फिट बैठता है जिसे भरे हुए सिल्हूट और जानबूझकर खुलेपन के रूप में व्यक्त किया जा सकता है। रैस्टर को तब रखें जब नरम छायांकन या आंशिक अस्पष्टता उस कलाकृति का हिस्सा हो जिसे आपको संरक्षित करने की आवश्यकता है। कई सार्थक रंगों के लिए, रंग-सक्षम वैश्वीकरण वर्कफ़्लो का उपयोग करें या जानबूझकर अलग-अलग पास तैयार करें; यह एकल मोनोक्रोम कमांड रंग पैलेट नहीं बनाता है।

आप एक महत्वपूर्ण रूपरेखा को फिर से बनाने के लिए एक वेक्टर संपादक का भी उपयोग कर सकते हैं। स्वचालित ट्रेसिंग एक उम्मीदवार आकार प्रदान करती है, और आपका इच्छित उपयोग यह निर्धारित करता है कि इसे रखना है या संपादित करना है।

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

क्या Potrace सीधे PNG खोल सकता है? मानक Potrace 1.16 पीबीएम, पीजीएम, पीपीएम और बीएमपी इनपुट स्वीकार करता है। पहले PNG को किसी अन्य छवि उपकरण के साथ डिकोड करें, इसकी पारदर्शिता उपचार को स्पष्ट करें, और ट्रेसिंग से पहले एक समर्थित बिटमैप को सहेजें।

क्या Potrace PNG पारदर्शिता को बरकरार रखता है? मोनोक्रोम वर्कफ़्लो भरी हुई ज्यामिति और खाली क्षेत्र बनाता है। यह PNG के निरंतर अल्फा मानों को संरक्षित नहीं करता है। थ्रेशोल्डिंग से पहले एक जानबूझकर मैट पर समग्र पारदर्शी पिक्सेल, फिर एक विपरीत पृष्ठभूमि पर SVG के खाली क्षेत्रों को सत्यापित करें।

क्या अल्फ़ामैक्स PNG अल्फ़ा सेटिंग है? नहीं, Potrace का अल्फ़ामैक्स ट्रेस किए गए वक्रों में कोने के उपचार को नियंत्रित करता है। यह यह निर्धारित नहीं करता है कि ट्रेसिंग से पहले PNG का अपारदर्शिता चैनल कैसे संयोजित किया जाता है।

एक छेद क्यों गायब हो गया? जांचें कि तैयार बिटमैप और चयनित थ्रेशोल्ड में उद्घाटन अभी भी दिखाई दे रहा है या नहीं। यदि सीमा इसे भर देती है, तो तैयारी या कटऑफ बदलें और पुनः ट्रेस करें। यदि SVG में उद्घाटन है लेकिन केवल एक प्राप्तकर्ता ऐप ही इसे भरता है, तो वहां कंपाउंड-पथ और भरण-नियम हैंडलिंग की जांच करें।

स्रोत

  1. Potrace - मैनुअल - समर्थित इनपुट प्रारूप, मोनोक्रोम थ्रेशोल्डिंग, SVG आउटपुट और नामित कमांड विकल्प।
  2. Pillow — छवि मॉड्यूल — RGBA छवि संयोजन और तैयारी स्निपेट में प्रयुक्त क्रम।
  3. W3C — PNG विशिष्टता — PNG छवियों में रंग नमूने और अल्फा प्रतिनिधित्व।
  4. W3C — SVG पथ — यौगिक पथ और आंतरिक आकृतियाँ जो उद्घाटन का वर्णन कर सकती हैं।

PerfectVector में अपनी खुद की छवि के साथ निःशुल्क शुरुआत करें, फिर अगला संपादन चरण चुनने से पहले स्रोत के सामने उसके सिल्हूट और आंतरिक उद्घाटन की जांच करें।

Blog से और

PerfectVector

अपनी इमेज को
साफ़, एडिट करने योग्य वेक्टर पाथ में बदलें

वेक्टराइज़ करें और प्रीव्यू जाँचें — मुफ़्त और बिना किसी दैनिक सीमा के।