1 Prossimo passo:
• Usiamo struttura mesh indexed
• Due tipi di buffer, detti:
M a r c o T a r i n i ‧ C o m p u t e r G r a p h i c s ‧ 2 0 1 4 / 1 5 ‧ U n i v e r s i t à d e l l ’ I n s u b r i a
ARRAY_BUFFER ELEMENT_ARRAY_BUFFER array di indici
• indici di vertice, per primitiva (element)
• connettività della mesh array di vertici
• geometria + attributi, per vertice
(l’unico che c’era prima)
Prima mesh indicizzata:
• Un quad con diagonal split
– (4 vertici, 2 tris)
M a r c o T a r i n i ‧ C o m p u t e r G r a p h i c s ‧ 2 0 1 4 / 1 5 ‧ U n i v e r s i t à d e l l ’ I n s u b r i a
V0 V1
V2 V3
var indices = [
0,1,2, // 1st triangle 1,3,2, // 2nd triangle ];
Prepariamo il buffer di indici
• Un buffer ulteriore per la connettività della mesh
• Similmente agli altri buffer:
M a r c o T a r i n i ‧ C o m p u t e r G r a p h i c s ‧ 2 0 1 4 / 1 5 ‧ U n i v e r s i t à d e l l ’ I n s u b r i a
var connettivita = gl.createBuffer();
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, connettivita );
var indices = [
0,1,2, // 1st triangle 1,3,2, // 2nd triangle ];
var indexData = new Uint16Array( indices );
gl.bufferData(
gl.ELEMENT_ARRAY_BUFFER, indexData,
gl.STATIC_DRAW );
Disegnamo la mesh indicizzata
M a r c o T a r i n i ‧ C o m p u t e r G r a p h i c s ‧ 2 0 1 4 / 1 5 ‧ U n i v e r s i t à d e l l ’ I n s u b r i a
gl.drawArrays( gl.TRIANGLES , 0, 3
);
gl.drawElements( gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0 );
quanti indici di vertice
(ogni 3 = un tri) a partire da quale quanti vertici
(ogni 3 = un tri)
mesh non indicizzata,
mesh
indicizzata
2
Per i dettagli,
vedere l’implementazione sul sito (come al solito):
lez 18B
M a r c o T a r i n i ‧ C o m p u t e r G r a p h i c s ‧ 2 0 1 4 / 1 5 ‧ U n i v e r s i t à d e l l ’ I n s u b r i a