इस नियमावली ने मेरे लिए काम किया। यह बहुत जानकारीपूर्ण है। वह लेखक स्केच निर्यात समस्याओं के बारे में बात करता है। मैं अपने लेख से उद्धृत कर रहा हूँ अगर मामले को हटा दिया जाएगा।
कुल मिलाकर समाधान
- प्रत्येक आइकन के लिए एक आर्टबोर्ड बनाएं (डालें -> आर्टबोर्ड)।
- सुनिश्चित करें कि प्रत्येक आर्टबोर्ड की स्थिति में कोई आधा-पिक्सेल नहीं है और यह एक सम संख्या है।
- सभी आइकन घुमाव निकालें।
- किसी भी बाउंडिंग बॉक्स को हटा दें ताकि स्केच अनावश्यक कोड निर्यात न करें।
- SVG को बॉर्डर लेयर> पाथ> वेक्टराइज़ स्ट्रोक से बाहर होने से रोकें (धन्यवाद गस )
- निर्यात साफ .svg
* यह वह आइकन है जिसे लेखक ने निर्यात करने की कोशिश की है
स्केच निर्यात करने वाले कीड़े
बग # 1
निश्चित स्केच निर्यात को आर्टबोर्ड स्थिति में बदलकर सम संख्या में बदल देता है। यह कोड में किसी भी परिवर्तन को हटा देता है। एक अन्य नोट पर, चूंकि स्थिति आधे-पिक्सेल से बंद थी, स्केच ने मेरे व्यूबॉक्स का आकार 0 0 25 25 में बदल दिया। मेरा मूल आर्टबोर्ड 24 x 24px था। इस बग ने कोड में चश्मा भी जोड़ा। नहीं बुएनो।
बग # 2
समस्या: डिजाइन के अनुसार, प्रत्येक आइकन चौड़ाई पर सेट था: जीपीएक्स, ऊंचाई: जीपीएक्स, और बॉर्डर-त्रिज्या: 3 पीएक्स। समस्या यह है कि निर्यात करते समय, आयत को पथ में जोड़ा गया था, इस प्रकार सीएसएस द्वारा किसी भी आकार में स्केल करना मुश्किल हो गया।
समाधान: किसी भी पारदर्शी बाउंडिंग बॉक्स को हटा दें और css को जादू करने दें। सभी डेवलपर्स को वास्तव में जरूरत थी 24 x 24px पर सेट किया गया व्यूबॉक्स। वे चौड़ाई, ऊंचाई और सीमा-त्रिज्या में जोड़ सकते हैं।
बग # ३
समस्या: स्केच एक घुमाव (-180.000000) निर्यात करता है।
<path d=”M16,7.4 L14.4864865,6 L8,12 L14.4864865,18 L16,16.6 L11.027027,12 L16,7.4 Z” fill=”#000000" transform=”translate(12.000000, 12.000000) rotate(-180.000000) translate(-12.000000, -12.000000) “></path>
समाधान: अपने .svg आइकन को Adobe Illustrator में खोलें, आइकन को घुमाएँ, फिर स्केच में खींचें और छोड़ें। यह सब एक साथ रोटेशन को हटा देता है।
बग # 4
समस्या: स्लाइस टूल एक्सपोर्ट ट्रांसलेशन का उपयोग करके फिर से ट्रांसफ़ॉर्म करता है। समाधान: कुछ भी नहीं। बस यह मत करो। वैसे भी स्लाइस करने में बहुत समय लगता है और समय की बर्बादी होती है।