डाउनस्केलिंग द्वारा पुन: नमूनाकरण छवि गुणवत्ता को कम करता है?

यहां लक्ष्य ब्राउज़र वातावरण में अपनी गुणवत्ता को संरक्षित करते हुए एक छवि के आकार को कम करना है। समस्या तब उत्पन्न होती है जब HTML5 कैनवास का उपयोग करके किसी छवि को छोटा किया जाता है, जिसके परिणामस्वरूप छवि खराब हो जाती है।

डाउनस्केलिंग बनाम इंटरपोलेशन

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

समाधान: पिक्सेल परफेक्ट डाउनस्केलिंग एल्गोरिदम

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

कार्यान्वयन विवरण

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

सीमाएं

हालांकि यह एल्गोरिदम उच्च गुणवत्ता वाली डाउनस्केलिंग प्रदान करता है, लेकिन getImageData और putImageData फ़ंक्शंस के उपयोग के कारण बड़ी छवियों को संसाधित करना धीमा हो सकता है।

अतिरिक्त विचार

छोटी छवियों के लिए, HTML5 कैनवास का उपयोग करके कई बार डाउनस्केलिंग की जा सकती है अंतर्निहित स्केलिंग तंत्र, क्योंकि वे छोटी छवियों के लिए अनुकूलन करते हैं। बड़ी छवियों के लिए, डाउनस्केलिंग के लिए सीएसएस या वेबजीएल जैसी अन्य विधियों का उपयोग करने पर विचार करें।