निर्बाध तिलमप प्रतिपादन (सीमावर्ती आसन्न चित्र)

Question

मेरे पास एक 2D गेम इंजन है जो एक टाइलसेट इमेज से टाइलें खींचकर टिलमैप्स बनाता है। क्योंकि डिफ़ॉल्ट रूप से ओपनजीएल केवल पूरी बनावट ( GL_REPEAT) को लपेट सकता है , और केवल इसका हिस्सा नहीं है, प्रत्येक टाइल को अलग बनावट में विभाजित किया जाता है। फिर एक ही टाइल के क्षेत्र एक दूसरे से सटे हुए हैं। जब यह इरादा के अनुसार काम कर रहा हो तो यह कैसा दिखता है:

हालांकि जैसे ही आप भिन्नात्मक स्केलिंग शुरू करते हैं, सीम दिखाई देते हैं:

ऐसा क्यों होता है? मुझे लगा कि यह रैखिक फ़िल्टरिंग के कारण क्वैड्स की सीमाओं को मिश्रित कर रहा है, लेकिन यह अभी भी पॉइंट फ़िल्टरिंग के साथ होता है। एकमात्र समाधान जो मैंने अब तक पाया है, यह सुनिश्चित करने के लिए है कि सभी स्थिति और स्केलिंग पूर्णांक मानों पर ही होती है, और बिंदु फ़िल्टरिंग का उपयोग करना है। यह खेल की दृश्य गुणवत्ता को ख़राब कर सकता है (विशेष रूप से कि उप-पिक्सेल स्थिति अब काम नहीं करती है इसलिए गति इतनी चिकनी नहीं है)।

जिन चीजों की मैंने कोशिश की है / जिन पर विचार किया है:

• एंटीएलियासिंग कम कर देता है, लेकिन पूरी तरह से खत्म नहीं करता है, सीम
• Mipmapping बंद करने से कोई प्रभाव नहीं पड़ता है
• प्रत्येक टाइल को व्यक्तिगत रूप से रेंडर करें और किनारों को 1px से बढ़ाएं - लेकिन यह एक डी-ऑप्टिमाइज़ेशन है, क्योंकि यह अब टाइलों के क्षेत्रों को एक बार में प्रस्तुत नहीं कर सकता है, और पारदर्शिता के क्षेत्रों के किनारों के साथ अन्य कलाकृतियों का निर्माण करता है।
• स्रोत छवियों के चारों ओर 1px की सीमा जोड़ें और अंतिम पिक्सल को दोहराएं - लेकिन फिर वे पावर-ऑफ-टू नहीं हैं, जिससे एनपीओटी समर्थन के बिना सिस्टम के साथ संगतता समस्याएं हो सकती हैं
• टाइल वाली छवियों को संभालने के लिए एक कस्टम shader लिखना - लेकिन फिर आप अलग तरीके से क्या करेंगे? GL_REPEATसीमाओं पर छवि के विपरीत पक्ष से पिक्सेल को हथियाना चाहिए, और पारदर्शिता नहीं लेनी चाहिए।
• ज्यामिति बिलकुल समीप है, कोई अस्थायी बिंदु नहीं है, जो गोल-गोल त्रुटी है।
• अगर एक ही रंग को वापस करने के लिए टुकड़े टुकड़े करना कठिन कोडित किया जाता है, तो सीम गायब हो जाते हैं ।
• यदि GL_CLAMPइसके बजाय बनावट सेट की जाती है GL_REPEAT, तो सीम गायब हो जाते हैं (हालांकि प्रतिपादन गलत है)।
• यदि पाठ सेट किए जाते हैं GL_MIRRORED_REPEAT, तो सीम गायब हो जाते हैं (हालांकि रेंडरिंग फिर से गलत है)।
• यदि मैं पृष्ठभूमि को लाल बनाता हूं, तो सीम अभी भी सफेद हैं। इससे पता चलता है कि यह पारदर्शिता के बजाय कहीं से अपारदर्शी सफेद नमूना ले रहा है।

इसलिए सीम GL_REPEATसेट होने पर ही दिखाई देते हैं । केवल इस मोड में किसी कारण से, ज्यामिति के किनारों पर कुछ ब्लीड / लीकेज / पारदर्शिता है। ऐसे कैसे हो सकता है? संपूर्ण बनावट अपारदर्शी है।

Comments

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

— इवान

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

— नाथन रीड

आप एक बनावट एटलस में व्यक्तिगत टाइलों के दोहराव को लागू कर सकते हैं। आपको गणित के कुछ अतिरिक्त बनावट को समन्वित करने और प्रत्येक टाइल के चारों ओर सीमा टेक्सल्स सम्मिलित करने की आवश्यकता है। यह लेख इस बारे में बहुत कुछ समझाता है (हालांकि ज्यादातर डी 3 डी 9 के कष्टप्रद बनावट समन्वय सम्मेलन पर ध्यान देने के साथ)। वैकल्पिक रूप से, यदि आपका कार्यान्वयन काफी नया है, तो आप अपने टाइल मानचित्र के लिए सरणी बनावट का उपयोग कर सकते हैं; यह मानते हुए कि प्रत्येक टाइल के समान आयाम हैं यह बहुत अच्छा काम करेगा और इसके लिए किसी अतिरिक्त समन्वय गणित की आवश्यकता नहीं होगी।

— एंडन एम। कोलमैन

समन्वय दिशा GL_NEARESTमें नमूने के साथ 3 डी बनावट Rभी इस परिदृश्य में ज्यादातर चीजों के लिए सिर्फ सरणी बनावट के रूप में अच्छी तरह से काम करते हैं। Mipmapping काम नहीं करने वाला है, लेकिन आपके आवेदन को देखते हुए, आपको शायद किसी भी तरह mipmaps की आवश्यकता नहीं है।

— एंडन एम। कोलमैन

किस तरह से "गलत" प्रतिपादन किया जाता है, जब सीएलएमपी पर सेट किया जाता है?

— मार्टिअन कोर्टको

Answer 1

GL_REPEAT के साथ नमूना लेने के लिए सीम सही व्यवहार है। निम्नलिखित टाइल पर विचार करें:

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

एंटीएलियासिंग कम कर देता है, लेकिन पूरी तरह से खत्म नहीं करता है, सीम

MSAA बहुभुज किनारों के आसपास अधिक नमूने लेकर काम करता है। किनारे के बाएं-दाएं या दाएं हिस्से को "हरा" (फिर से, पहले चित्र के बाएं किनारे पर विचार करना) होगा, और किनारे पर "बेज" क्षेत्र से आंशिक रूप से नमूना लेना केवल एक नमूना होगा। जब नमूने मिश्रित होते हैं तो प्रभाव कम हो जाएगा।

संभव समाधान:

किसी भी मामले में आपको GL_CLAMPबनावट के विपरीत तरफ पिक्सेल से रक्तस्राव को रोकने के लिए स्विच करना चाहिए । फिर आपके पास तीन विकल्प हैं:

1. टाइलों के बीच संक्रमण को थोड़ा सुचारू करने के लिए एंटी-अलियासिंग सक्षम करें।

2. करने के लिए बनावट फ़िल्टरिंग सेट करें GL_NEAREST। यह सभी पिक्सेल को कठोर किनारे देता है, इसलिए बहुभुज / स्प्राइट किनारे अप्रभेद्य हो जाते हैं, लेकिन यह स्पष्ट रूप से खेल की शैली को काफी बदल देता है।

3. पहले से ही चर्चा की गई 1px सीमा जोड़ें, बस यह सुनिश्चित करें कि सीमा में आसन्न टाइल का रंग है (और विपरीत किनारे का रंग नहीं)।

   • यह एक बनावट एटलस पर स्विच करने का एक अच्छा समय हो सकता है (बस इसे बड़ा करें यदि आप एनपीओटी समर्थन के बारे में चिंतित हैं)।
   • यह एकमात्र "सही" समाधान है, GL_LINEARपॉलीगोन / स्प्राइट्स के किनारों के पार सक्षम करने वाला समान है ।

Comments

ऊ, धन्यवाद - बनावट के चारों ओर लपेटता है यह समझाता है। मैं उन समाधानों में देखता हूँ!

— AshleysBrain

Answer 2

क्योंकि डिफ़ॉल्ट रूप से ओपनजीएल केवल पूरी बनावट (GL_REPEAT) को लपेट सकता है, और इसका हिस्सा ही नहीं, प्रत्येक टाइल एक अलग बनावट से अलग हो जाती है। फिर एक ही टाइल के क्षेत्र एक दूसरे से सटे हुए हैं।

ओपनजीएल में एकल, साधारण बनावट वाले क्वाड के प्रदर्शन पर विचार करें। क्या कोई सीम, किसी भी पैमाने पर हैं? नहीं कभी नहीं। आपका लक्ष्य अपने सभी दृश्य टाइलों को एक बनावट पर कसकर पैक करना है, फिर स्क्रीन पर भेजें। संपादित इस आगे स्पष्ट करने के लिए: आप प्रत्येक टाइल ट्रैक्टर पर असतत सीमांकन कोने है, तो आप करेंगे तो अधिकांश परिस्थितियों में प्रतीत होता है-अनुचित तेजी है। यह है कि GPU हार्डवेयर कैसे काम करता है ... फ्लोटिंग पॉइंट एरर इन गैप्स को वर्तमान परिप्रेक्ष्य के आधार पर बनाते हैं ... एरर जो कि एक एकीकृत मैनिफोल्ड से बचा जाता है, यदि दो चेहरों को एक ही मैनिफ़ेस्ट में सम्‍मिलित किया जाता है(सबमेश), हार्डवेयर उन्हें बिना सीम के, रेंडर करेगा। आपने अनगिनत गेम और ऐप में इसे देखा है। एक बार और सभी के लिए इससे बचने के लिए आपके पास एक एकल सबमेश पर एक कसकर भरी हुई बनावट होनी चाहिए। यह एक मुद्दा है जो बार-बार इस साइट पर और अन्य जगहों पर आता है: यदि आप अपनी टाइलों के कोने कोने (हर 4 टाइल एक कोने में शीर्ष साझा) को मर्ज नहीं करते हैं, तो सीम की अपेक्षा करें।

(विचार करें कि पूरे मानचित्र के चार कोनों को छोड़कर आपको वर्टिकल की आवश्यकता भी नहीं हो सकती है ... छायांकन के आपके दृष्टिकोण पर निर्भर करता है)

हल करने के लिए: रेंडर पर (1: 1 पर) अपने सभी टाइल टेक्सचर को बिना किसी अंतराल के FBO / RBO में , फिर उस FBO को डिफॉल्ट फ्रेमबफ़र (स्क्रीन) पर भेजें। क्योंकि FBO खुद मूल रूप से एक बनावट है, आप स्केलिंग पर अंतराल के साथ समाप्त नहीं कर सकते। यदि आप GL_LINEAR का उपयोग कर रहे हैं, तो सभी टेक्‍सेल सीमाएं, जो स्‍क्रीन पिक्सेल की बाउंड्री पर नहीं गिरती हैं, को मिश्रित किया जाएगा। यह मानक दृष्टिकोण है।

यह स्केलिंग के लिए विभिन्न मार्गों को भी खोलता है:

• क्वाड के आकार को स्केल करना जिससे आप FBO को रेंडर करेंगे
• उस क्वाड पर यूवी को बदलना
• कैमरा सेटिंग्स के साथ fiddling

Comments

मुझे नहीं लगता कि यह हमारे लिए अच्छा काम करेगा। ऐसा लगता है कि आप प्रस्ताव कर रहे हैं कि 10% ज़ूम पर हम 10 गुना बड़ा क्षेत्र प्रदान करते हैं। यह सीमित भरण दर वाले उपकरणों के लिए अच्छा नहीं है। इसके अलावा, मुझे अभी भी पता चला है कि विशेष रूप से GL_REPEAT केवल सीम का कारण क्यों बनता है, और कोई अन्य मोड नहीं करता है। यह कैसे हो सकता है?

— एशलेब्रेन

@AshleysBrain गैर अनुक्रमिक। आपके कथन से मैं चकित हूं । कृपया बताएं कि 10% बढ़ने पर ज़ूम इन 10% की दर कैसे बढ़ती है? या 10x से जूम कैसे बढ़ता है - क्योंकि व्यूपोर्ट क्लिपिंग एक सिंगल पास पर 100% से अधिक भरण दर को रोक सकती है? मैं आपको सुझाव दे रहा हूं कि आप वही दिखा रहे हैं जिसका आप पहले से ही इरादा कर रहे हैं - कोई अधिक नहीं, कम नहीं - क्या संभव है कि एक अधिक कुशल और निर्बाध फैशन हो, एक सामान्य तकनीक आरटीटी का उपयोग करके अपने अंतिम आउटपुट को एकीकृत करके। हार्डवेयर वस्तुतः बिना किसी लागत के व्यूपोर्ट क्लिपिंग, स्केलिंग, सम्मिश्रण और प्रक्षेप को संभालेगा, यह देखते हुए कि यह केवल 2 डी इंजन है।

— इंजीनियर

@AshleysBrain मैंने आपके वर्तमान दृष्टिकोण के साथ मुद्दों को स्पष्ट करने के लिए अपने प्रश्न को संपादित किया है।

— इंजीनियर

@ArcaneEngineer हाय, मैंने आपके दृष्टिकोण की कोशिश की है जो पूरी तरह से सीम मुद्दे को हल करता है। हालांकि, अब, सीम होने के बजाय मेरे पास पिक्सेल त्रुटियां हैं। आप उस मुद्दे का अंदाजा लगा सकते हैं जिसका मैं यहां उल्लेख कर रहा हूं । क्या आपके पास इसका कोई कारण है? ध्यान दें कि मैं WebGL में सब कुछ कर रहा हूं।

— नेमीकोल

@ArcaneEngineer मैं एक नया सवाल पूछूँगा, यहाँ बहुत ही बोझिल है। मुझे झुंझलाहट के लिए खेद है।

— नेमीकोल

Answer 3

यदि छवियों को एक सतह के रूप में प्रदर्शित किया जाना चाहिए, तो उन्हें एक 3 डी मेष / विमान पर एक सतह बनावट (स्केल 1x) के रूप में प्रस्तुत करें। यदि आप प्रत्येक को एक अलग 3 डी ऑब्जेक्ट के रूप में प्रस्तुत करते हैं, तो यह हमेशा गोल त्रुटियों के कारण सीम होगा।

@ निक-विग्गिल द्वारा उत्तर सही है, मुझे लगता है कि आपने इसे गलत समझा।

Answer 4

2 संभावनाएं जो प्रयास करने लायक हो सकती हैं:

1. इनकी बनावट छानने के GL_NEARESTबजाय उपयोग करें GL_LINEAR। (जैसा कि एंडन एम। कोलमैन ने बताया है)

   GL_LINEARवसीयत (प्रभाव में) छवि को कभी भी थोड़ा धुंधला (निकटतम पिक्सेल के बीच प्रक्षेपित), जो एक पिक्सेल से अगले में रंग में एक चिकनी संक्रमण के लिए अनुमति देता है। यह कई मामलों में बनावट को बेहतर बनाने में मदद कर सकता है, क्योंकि यह आपके बनावट को उन सभी अवरुद्ध पिक्सेल से रोकता है। यह भी बनाता है ताकि एक टाइल के एक पिक्सेल से थोड़ा सा भूरा बगल के टाइल के आस-पास के हरे रंग के पिक्सेल पर धुंधला हो जाए।

   GL_NEARESTबस निकटतम पिक्सेल पाता है और उस रंग का उपयोग करता है। कोई प्रक्षेप नहीं। नतीजतन, यह वास्तव में थोड़ा तेज है।

2. बनावट को सिकोड़ें प्रत्येक टाइल के लिए थोड़ा निर्देशांक।

   प्रत्येक टाइल के चारों ओर उस अतिरिक्त पिक्सेल को बफर के रूप में जोड़ने की तरह, छवि पर टाइल का विस्तार करने के बजाय, आप सॉफ़्टवेयर में टाइल को सिकोड़ते हैं। 16x16px टाइल्स के बजाय रेंडरिंग करते समय 14x14px टाइल।

   तुम भी 14.5x14.5 टाइल्स के साथ दूर करने में सक्षम हो सकता है बिना बहुत अधिक भूरा मिलाया जा रहा है।

--edit--

जैसा कि ऊपर की छवि में दिखाया गया है, आप अभी भी आसानी से दो बनावट की शक्ति का उपयोग कर सकते हैं। तो आप हार्डवेयर का समर्थन कर सकते हैं जो एनपीओटी बनावट का समर्थन नहीं करता है। क्या परिवर्तन आपके बनावट निर्देशांक, बजाय से जाने की है (0.0f, 0.0f)करने के लिए (1.0f, 1.0f)आप से जाना चाहते हैं (0.03125f, 0.03125f)करने के लिए (0.96875f, 0.96875f)।

यह आपके टेक्स-कोर्ड्स को टाइल के अंदर थोड़ा सा डालता है जो कि गेम में प्रभावी रिज़ॉल्यूशन को कम करता है (हालाँकि हार्डवेयर पर नहीं ताकि आपके पास अभी भी पावर-टू-टू टेक्सचर हो), हालाँकि टेक्सचर का विस्तार करने के समान रेंडरिंग प्रभाव होना चाहिए।

Comments

मैंने पहले ही उल्लेख किया है कि मैंने GL_NEAREST (उर्फ पॉइंट फ़िल्टरिंग) की कोशिश की, और यह इसे ठीक नहीं करता है। मैं # 2 नहीं कर सकता क्योंकि मुझे एनपीओटी उपकरणों का समर्थन करने की आवश्यकता है।

— AshleysBrain

एक ऐसा संपादन किया जो कुछ चीजों को साफ कर सकता है। (मैं मान रहा हूं कि "एनपीओटी [(नॉन पावर-ऑफ-टू)] डिवाइसेस को सपोर्ट करने की जरूरत है") का मतलब था कि आप की तर्ज पर कुछ को 2 के कुछ पावर पर टेक्सचर रखने की जरूरत है?)

— वोल्फगैंग स्काईलर

Answer 5

यहां मुझे लगता है कि ऐसा हो सकता है: जहां दो टाइलें टकराती हैं, उनके किनारों का x घटक बराबर होना चाहिए। अगर यह सच नहीं है, तो वे विपरीत दिशा में गोल हो सकते हैं। तो सुनिश्चित करें कि उनके पास समान x मान है। आप यह कैसे सुनिश्चित करते हैं कि ऐसा होता है? आप कोशिश कर सकते हैं, कह सकते हैं, 10 से गुणा करें, फिर 10 से विभाजित करें (केवल सीपीयू पर ऐसा करें, इससे पहले कि आपके कंधे वर्टीकल शेडर में जा रहे हों)। उसे सही परिणाम देना चाहिए। इसके अलावा, ट्रांसफॉर्मेशन मैट्रिसेस का उपयोग करके टाइल को टाइल से न खींचें, लेकिन उन्हें एक बैच VBO में डाल दें ताकि यह सुनिश्चित हो सके कि मैट्रिक्स गुणन के साथ संयोजन में हानिपूर्ण IEEE फ़्लोटिंग पॉइंट सिस्टम से गलत परिणाम नहीं आ रहे हैं।

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

समस्या यह भी हो सकती है कि आप स्प्राइटशीट (जिसे एटलस भी कहा जाता है) का उपयोग कर रहे हैं और यह कि बनावट का नमूना लेते समय, आसन्न टाइल बनावट के पिक्सल को उठाया जाता है। यह सुनिश्चित करने के लिए कि यूवी मैपिंग में एक छोटी सीमा बनाने के लिए ऐसा नहीं होता है। इसलिए, यदि आपके पास 64x64 की टाइल है, तो आपकी यूवी मैपिंग थोड़ी कम होनी चाहिए। कितना? मुझे लगता है कि मैंने अपने खेल में आयत के प्रत्येक तरफ पिक्सेल के 1 चौथाई भाग का उपयोग किया था। तो x घटकों के लिए अपने UV के 1 / (4 * चौड़ाईOfTheAtlas) और y घटकों के लिए 1 / (4 * heightOfTheAtlas) को ऑफसेट करें।

Comments

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

— AshleysBrain

Answer 6

3 डी स्पेस में इसे हल करने के लिए, मैंने वुल्फगैंग स्केलेर के सुझाव के साथ बनावट सरणियों को मिलाया। मैंने प्रत्येक टाइल (120x120, 128x128 कुल) के लिए अपनी वास्तविक बनावट के चारों ओर 8-पिक्सेल की सीमा लगाई, जो कि प्रत्येक पक्ष के लिए, जिसे मैं "लिपटे" छवि से भर सकता था या जिस तरफ बढ़ाया जा रहा था। नमूना इस क्षेत्र को पढ़ता है जब यह छवि को प्रक्षेपित कर रहा है।

अब फ़िल्टरिंग और माइपमैपिंग के साथ, सैंपलर अभी भी आसानी से पूरे 8 पिक्सेल बॉर्डर को पढ़ सकता है। उस छोटी समस्या को पकड़ने के लिए (मैं छोटा कहता हूं क्योंकि यह केवल कुछ पिक्सेल पर होता है जब ज्यामिति वास्तव में तिरछी या दूर होती है), मैं टाइलों को एक बनावट सरणी में विभाजित करता हूं, इसलिए प्रत्येक टाइल का अपना बनावट स्थान होता है और क्लैम्पिंग का उपयोग कर सकता है। किनारों।

आपके मामले में (2 डी / फ्लैट), मैं निश्चित रूप से एक पिक्सेल सही दृश्य प्रदान करने के साथ जाऊंगा, और फिर परिणाम के वांछित हिस्से को व्यूपोर्ट में स्केल कर दूंगा, जैसा कि निक विग्गिल ने सुझाव दिया था।