सूचकांक बफर क्या है और यह शीर्ष बफ़र्स से कैसे संबंधित है?


11

मेरे पास इस तरह एक शीर्ष बफर है:

0.0, 0.0,
1.0, 0.0,
0.0, 0.6,
1.0, 0.6,
0.5, 1.0

मैं निम्नलिखित सूचकांक बफर है:

0, 2,
2, 4,
4, 3,
3, 2,
2, 1,
1, 0,
0, 3,
3, 1

मुझे पता है कि मैं gl.LINESWebGL का उपयोग करना चाहता हूं , जिसका अर्थ है कई अलग-अलग लाइन सेगमेंट।

gl.drawElements(gl.LINES, 16, gl.UNSIGNED_SHORT, indexBuffer);

ऐसा लगता है कि WebGL में एक ही ड्रॉ कॉल में कई लाइन सेगमेंट को खींचने में सक्षम है।

क्या कोई मेरे लिए ELI5 कर सकता है, एक इंडेक्स बफर क्या है और यह शीर्ष बफ़र्स से कैसे संबंधित है? मेरी प्राथमिकताओं से सूचकांक बफ़र्स कैसे उत्पन्न करें?

जवाबों:


12

कोई मुझे ELI5 दे सकता है, इंडेक्स बफर क्या है और यह वर्टेक्स बफ़र्स से कैसे संबंधित है

आपके शीर्ष बफ़र में 5 कोने के X और Y निर्देशांक होते हैं। वो हैं:

index |  X  |  Y
  0   | 0.0 | 0.0 
  1   | 1.0 | 0.0
  2   | 0.0 | 0.6
  3   | 1.0 | 0.6
  4   | 0.5 | 1.0

आपके अनुक्रमणिका बफ़र में इन शीर्षकों के बीच किन रेखाओं के बारे में जानकारी है। यह मूल्य के रूप में वर्टेक्स बफर में प्रत्येक शीर्ष के सूचकांक का उपयोग करता है।

चूंकि आप रेखाएँ खींच रहे हैं, इसलिए आपके सूचकांक बफ़र में लगातार प्रत्येक जोड़ी एक पंक्ति खंड को इंगित करता है। उदाहरण के लिए, यदि सूचकांक बफर के साथ शुरू होता है 0, 2, तो इसका मतलब है कि वर्टेक्स ऐरे में 0 वें और 2 वें कोने के बीच एक रेखा खींचना, जो इस स्थिति में एक रेखा को खींचता [0.0, 0.0]है [0.0, 0.6]

निम्नलिखित ग्राफिक में सूचकांकों के प्रत्येक जोड़े को इंगित की गई लाइन के साथ रंगीन समन्वित किया गया है:

यहाँ छवि विवरण दर्ज करें

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

0, 1, 2,
2, 1, 3,
2, 3, 4,

5

यदि आपके पास इस तरह एक शीर्ष बफर है:

var vertices = [
  0.0, 0.0, 0.0,
  1.0, 0.0, 0.0,
  0.0, 0.6, 0.0,
  1.0, 0.6, 0.0,
  0.5, 1.0, 0.0
]

और बस इसे ड्रा करें जैसा कि यह है:

// Create an empty buffer object
var vertex_buffer = gl.createBuffer();

// Bind appropriate array buffer to it
gl.bindBuffer(gl.ARRAY_BUFFER, vertex_buffer);

// Pass the vertex data to the buffer
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);

/* [...] */

// Draw the lines
gl.drawArrays(gl.LINES, 0, 5);

इसके लिए प्रत्येक लाइन खंड के लिए दो समर्पित निर्देशांक की आवश्यकता होगी। साथ verticesऊपर परिभाषित है, यह केवल संभव होगा दो आकर्षित दो पंक्तियों :

दो लाइनें

यदि आपके पास निम्नलिखित सूचकांक परिभाषित हैं:

var indices = [
  0, 2,
  2, 4,
  4, 3,
  3, 2,
  2, 1,
  1, 0,
  0, 3,
  3, 1
]

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

var index_buffer = gl.createBuffer();

gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, index_buffer);

gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);

// draw geometry lines by indices
gl.drawElements(gl.LINES, 16, gl.UNSIGNED_SHORT, index_buffer);

एक ही बार में एक ही कोने को फिर से परिभाषित किए बिना जटिल आंकड़े खींच सकते हैं। यह परिणाम है:

एक घर

सूचकांकों के बिना एक ही परिणाम प्राप्त करने के लिए, शीर्ष बफर को निम्नलिखित की तरह दिखना चाहिए:

var vertices = [
  0.0, 0.0, 0.0,
  0.0, 0.6, 0.0,
  0.0, 0.6, 0.0,
  0.5, 1.0, 0.0,
  0.5, 1.0, 0.0,
  1.0, 0.6, 0.0,
  1.0, 0.6, 0.0,
  0.0, 0.6, 0.0,
  0.0, 0.6, 0.0,
  1.0, 0.0, 0.0,
  1.0, 0.0, 0.0,
  0.0, 0.0, 0.0,
  0.0, 0.0, 0.0,
  1.0, 0.6, 0.0,
  1.0, 0.6, 0.0,
  1.0, 0.0, 0.0
]

/* [...] */

// Draw the lines
gl.drawArrays(gl.LINES, 0, 16);

जो एक ही छवि में परिणाम:

अभी तक एक और घर

संग्रहीत कार्यक्षेत्र में विशाल अतिरेक पर ध्यान दें।


2
यदि आप तुरंत अपने स्वयं के प्रश्न का उत्तर देने की योजना बनाते हैं, तो कृपया कम से कम इस प्रश्न का उल्लेख करें ताकि अन्य अपना समय बर्बाद न करें।
12:13

2
हर अच्छे प्रश्न के 2 या 3 अच्छे उत्तर होने चाहिए। आपने अपना समय बर्बाद नहीं किया और मैंने वास्तव में आपके पुतलों की सराहना की। मुझे प्रोजेक्ट पार्टनर को लॉजिक समझाने के लिए इस थ्रेड की आवश्यकता है और आपकी पोस्ट उसे अलॉट करने में मदद करेगी।
Afr

1
@ 5chdn स्व उत्तर देने को अत्यधिक प्रोत्साहित किया जाता है । इस उत्तर को जोड़ने के लिए धन्यवाद। यदि आप प्रश्न पोस्ट करते समय मन में एक उत्तर देते हैं, तो प्रश्न के नीचे एक टिक बॉक्स होता है, जो आपको प्रश्न पोस्ट करने से पहले अपना उत्तर लिखने की अनुमति देगा, इसलिए दोनों एक ही समय में दिखाई देंगे। यह सिर्फ आपको यह बताने के लिए है कि यदि यह उपयोगी है, तो आपको यह करने की आवश्यकता नहीं है - प्रश्न पोस्ट करने के बाद निश्चित रूप से किसी भी अंतराल पर आत्म जवाबों का बहुत स्वागत है।
ट्राइकोप्लेक्स
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.