একটি সূচক বাফার কী এবং এটি কীভাবে ভার্টেক্স বাফারগুলির সাথে সম্পর্কিত?

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.LINESওয়েবজিএল ব্যবহার করে আঁকতে চাই , এর অর্থ একাধিক পৃথক রেখার বিভাগ।

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

এটি ওয়েবজিএলে একক ড্র কলটিতে একাধিক লাইন বিভাগের অঙ্কন সক্ষম করে বলে মনে হচ্ছে।

কেউ কি আমার কাছে ELI5 করতে পারে, একটি সূচক বাফার কী এবং এটি কীভাবে ভার্টেক্স বাফারের সাথে সম্পর্কিত? আমার আদিম থেকে সূচক বাফারগুলি কীভাবে উত্পন্ন করা যায়?

— Afr
সূত্র

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]।

নিম্নলিখিত গ্রাফিকের মধ্যে প্রতিটি সূচকের সূচকটি বর্ণিত রেখার সাথে রঙ সমন্বিত হয়:

একইভাবে, আপনি যদি রেখার পরিবর্তে ত্রিভুজ আঁকেন, আপনাকে একটি সূচক বাফার সরবরাহ করতে হবে যেখানে প্রতিটি পর পর তিনটি মান ভার্টেক্স বাফারে তিনটি উল্লম্ব সূচকগুলি নির্দেশ করে, যেমন

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

— Rotem
সূত্র

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
]

একই লম্বগুলি বার বার ছেদ করে এমন লাইনগুলি আঁকানো সম্ভব। এটি অপ্রয়োজনীয়তা হ্রাস করে। যদি আপনি সূচক বাফারটিকে আবদ্ধ করেন এবং GPU কে indecies অ্যারেতে নির্দিষ্ট আদেশ অনুসারে শীর্ষে সংযোগকারী লাইন বিভাগগুলি আঁকতে বলুন:

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);

একই চিত্রে যার ফলাফল:

সঞ্চিত কোণে বিশাল রিডানডেন্সি নোট করুন।

— Afr
সূত্র

2

যদি আপনি অবিলম্বে আপনার নিজের প্রশ্নের উত্তর দেওয়ার পরিকল্পনা করেন তবে দয়া করে কমপক্ষে প্রশ্নটিতে এটি উল্লেখ করুন যাতে অন্যরা তাদের সময় নষ্ট না করে।

— রোটেম

2

প্রতিটি ভাল প্রশ্নের 2 বা 3 টি ভাল উত্তর থাকা উচিত। আপনি আপনার সময় নষ্ট করেন নি এবং আমি সত্যই আপনার প্রশংসকদের প্রশংসা করেছি। প্রকল্পের অংশীদারকে যুক্তিটি ব্যাখ্যা করার জন্য আমার এই থ্রেডটি দরকার এবং আপনার পোস্ট তাকে অনেক সাহায্য করবে।

— আফ্রি

1

@ 5chdn স্ব-উত্তর দেওয়া অত্যন্ত উত্সাহিত । এই উত্তর যুক্ত করার জন্য ধন্যবাদ। আপনি যখন কোনও প্রশ্ন পোস্ট করার সময় মনে মনে উত্তর রাখেন, প্রশ্নের নীচে একটি টিক বক্স রয়েছে যা আপনাকে প্রশ্ন পোস্ট করার আগে আপনার উত্তরটি লেখার অনুমতি দেবে, তাই উভয় একই সময়ে উপস্থিত হবে। এটি কেবল আপনাকে দরকারী হিসাবে জানাতে হয় - আপনার অবশ্যই এটি করার দরকার নেই এবং প্রশ্ন পোস্ট করার পরে স্ব-উত্তরগুলি এখনও সময়ের অভ্যন্তরে খুব স্বাগত।

— ট্রাইকোপলাক্স