Vertex Arrays, Vertex Buffer Objects and Vertex Array...

26
Vertex Arrays, Vertex Buffer Objects and Vertex Array Objects Professor Raymond Zavodnik Specifying Data:Client Side Vertex Arrays Vertex Buffer Objects Specifying Data:Buffer Objects Storing Data on the Server Define Buffer Objects Encapsulate Vertex/Buffer Data Vertex Array Objects (VAO) Vertex Arrays, Vertex Buffer Objects and Vertex Array Objects Professor Raymond Zavodnik American University Armenia, February 19, 2017

Transcript of Vertex Arrays, Vertex Buffer Objects and Vertex Array...

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Vertex Arrays, Vertex Buffer Objects and

Vertex Array Objects

Professor Raymond Zavodnik

American University Armenia, February 19, 2017

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

VA, VBO and VAO

Geometric Primitives have been deprecated by

OpenGL

Calls to glVertex*(), glColor*() are too

expensive for applications

Data is repetitive

Consider a cube consisting of 6 quads

Each quad requires 4 verticesThus 24 points required

But there are only 8 different vertices!!

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

There Must Be A Better Way

Put the eight points into a one-dimensional array with

24 floating point entries

Do the same for colors, normals, textures to be used in

rendering

Access them by dereferencing pointers to this data

Number of function calls goes way down

If each vertex also had a normal vector associated with

it, these can likewise be put into (parallel)arrays

Or even interleaved for even more speed of access

You also gain by having no redundancy

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

What are Vertex Arrays (VA)

A VA is just an array containing vertex data, such as

coordinates, color, normal, etc.

Is in any case faster than immediate mode

Data can either be allocated in one interleaved array or

in several parallel arrays

VA’s are allocated by the client and stored clientside

VA’s can be modified by need (dynamic data vs static

data)

VA’s can be sent to the GPU by block transfer (see

below) to enhance performance

VA’s can, like display list, be compiled and cached

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Example

To implement a VA in an OpenGL program:

1 Declare with array declarations

2 Bind a VA with a call to glVertexPointer(), etc.3 Draw with a VA enable, e.g.

glEnableClientState() and a glDrawArrays()

in the redraw() function4 Don’t forget to disable with

glDisableClientState()

Look at triangleva.c

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Vertex Buffer Objects(VBO)

Consist of vertex data presented in arrays, not objects

as in OOP

These can be implemented clientside or on a GPU

With immediate mode vertex data is copied with each

drawing call

With VBO we copy the vertex data to a buffer before

drawing

This minimizes bus traffic between the CPU and GPU

The complex of various buffers is accessed by means

of a handle

Data in the parallel buffers is accessed per vertex

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Accessing Vertex Buffer Objects

1 Define your buffers

2 Define the associated VBO’s–one per data type with

e.g. glBufferData()

3 Bind the Buffers–one per data type with e,g,

glBindBuffer()

4 Obtain a pointer to the buffer data–one per data type

with e.g. glVertexPointer

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Drawing the VBO

There is no more glBegin() ... glEnd()

OpenGL introduced in later releases buffer-oriented

drawing commands, e.g. glDrawArrays on primitives

like GL_TRIANGLE_STRIP

In the redraw() function proceed as follows:

1 In redraw: Enable each VBO withglEnableClientState()

2 In redraw: Execute an appropriate drawing command,

e.g. glDrawArrays3 In redraw: Do not forget to disable each VBO with

disableClientState()

Example: trianglevbo.c

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Steps in Creating Indexed VBO’s

1 Define your arrays, mostly as global arrays

2 Then, instead of listing the raw data using

glVertex*(), etc. rewrite your redraw() function to

access the arrays.

3 Define pointers to your arrays

4 Dereference the elements

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

An Example

Consider our 2D triangle with vertices

(−0.9,−0.0), (0.9,−0.9), (0.0,0.9)

Use the three floating point colors red = (1.0,0.0,0.0),green = (0.0,1.0,0.0) and blue = (00.0,0.0,1.0)

For access use a three element array

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

An Example: Write the Data

const GLfloat vertices[] =

{-0.9,-0.9,0.9,-0.9,0.0,0.9}

const GLfloat colors[] =

{1.0,0.0,0.0,0.0,1.0,0.0,0.0,0.0,1.0}

indices[] = {0,1,2}

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Enable The Arrays

glEnableClientState(GL_VERTEX_ARRAY);

glEnableClientState(GL_COLOR_ARRAY);

This activates both arrays

You might need more, e.g. Normal Vectors and

Textures

IMPORTANT: Vertex Arrays are stored client or GPU

side, so they are not stored in display lists

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Accessing the Vertex Array Elements

Use pointers

Here you need to specify size and type of each

coordinate

There is an optional stride entry if it is desired to

interleave the arrays into one

Finally you specify a pointer to your data

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Accessing the Vertex Array elements

glVertexPointer(2, GL_FLOAT, 0,

vertices);

glColorPointer(3, GL_FLOAT,0,colors);

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Draw by Dereferencing

If you want to jump around in the array, use

glArrayElement()

To access sequentially use glDrawElements()

Specify the type of primitive, the number, the data type,

and the index array

Thus glDrawElements(GL_TRIANGLES, 3,

GL_UNSIGNED_BYTE, indices);

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Don’t Forget to Disable

You may not need the data, e.g. in certain sections of

your program

glDisableClientState(GL_VERTEX_ARRAY);

glDisableClientState(GL_COLOR_ARRAY);

That’s it!!

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Buffer Objects

Vertex Arrays eliminate immediate mode

BUT they cause too many round-trips between client

and server

Use Buffer Objects to store vertices and

associated data on the graphics server

Can also use Buffer Objects to store pixel data (less

important)

Steps to utilize

1 Create the Buffer Object

2 Activate it3 Transfer the data from user to server

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Create the Buffer Object

Associate an integer as a handle to the Buffer Object

OpenGL can do this automatically

Use glGenBuffers(GLSizei n, GLuint

*buffers)

Check if a specific handle is in active use call

glIsBuffer()with the integer in question as

parameter

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Activate a Specific Buffer

In general you can have many buffer handles

Call to initialize the buffer and its data in order to define

it

Thereafter it can be deactivated at will to use

selectively when its data is required

For example, when rendering is done with just that data

Use glBindBuffer(GLenum target, GLuint

buffer)

target is usually GL_ARRAY_BUFFER to be used with

Vertex Arrays

Stop usimg Buffer by binding to a buffer value of zero

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Getting Data into Buffer Objects

Start by reserving space on the server

Copy the data from the client’s memory into the buffer

object

Can load data later by passing NULL

Use glBufferData()with the following parameters

1 Specify a target, usually GL_ARRAY_BUFFER for vertexdata

2 Specify a buffer size in bytes3 Specify a pointer to the user data (or NULL)

4 Specify how to read and write after the transfer, e.g.

GL_STATIC_DRAW

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Using Buffer Objects with Vertex Arrays

You still need to tell OpenGL where to find your vertex

data in the buffer

Render using vertex-array rendering functions, such as

glDrawArrays() or glDrawElements()

Steps to do:

1 Obtain a buffer handle2 Bind the buffer object

3 Obtain server-side storage

4 Specify offsets in the server data withglVertexPointer(). This is different for shaders

5 Render

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Define Buffer Objects

Initialize buffers, in this case vertex data

unsigned i n t handle [ 3 ] ;

g lGenBuf fers (3 , handle ) ;

Bind to Vertices given by v (use GL_ARRAY_ELEMENT

for index arrays)

g lB indBu f fe r (GL_ARRAY_BUFFER, handle [ 0 ] )

g lBu f fe rDa ta (GL_ARRAY_BUFFER, sizeof ( v ) ,

GL_STATIC_DRAW) ;

Define a pointer to this data on the server:

g lVe r texPo in te r (3 , GL_FLOAT, 0 ,

( GLvoid ∗ ) ( ( char ∗ )NULL) ) ;

Do this for each buffer needed: colors, normals, texture,

indices

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Using Buffer Objects

g lEnab leC l ien tS ta te (GL_VERTEX_ARRAY) ;

glDrawElements (GL_QUADS, 24 , GL_UNSIGNED_BY

( GLvoid ∗ ) ( ( char ∗ )NULL + ( 0

g l D i sa b l e C l i e n t S t a t e (GL_VERTEX_ARRAY) ;

In draw() routine, for example, when drawing quads:

Enable for each attribute

Notice fake pointer to server-side storage

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Vertex Array Objects

It is desirable to switch between groups of vertex data

Therefore, encapsulate vertex array state, such as data

and buffers, into an object, call it, a Vertex Array Object

Proceed analogously to Buffer definitions

1 Generate the handle to the Vertex Array Object withglGenVertex Arrays

2 Bind to an object (if previously created) or make a new

one with glBindVertexArray()

3 See Shader lecture–only important for vertex data in

shaders

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Define Vertex Array Objects

Define Buffer Objects as above

Before first definition define a handle for each attribute

in the VAO:

GLuint vaoHandle [ ATTRIBS ] ;

g lGenVertexArrays ( ATTRIB, &vaoHandle ) ;

g lB indVer texAr ray ( vaoHandle ) ;

Do this for each Vertex, Normal, Color buffer required

Issue a glBindVertexArray(0); to deactivate the

VAO until use

Vertex Arrays,Vertex BufferObjects andVertex Array

Objects

ProfessorRaymondZavodnik

SpecifyingData:ClientSide

Vertex Arrays

Vertex Buffer Objects

SpecifyingData:BufferObjects

Storing Data on the

Server

Define Buffer Objects

EncapsulateVertex/BufferData

Vertex Array Objects

(VAO)

Use Vertex Array Objects

In your redraw() routine bind, draw and unbind (if

needed)

g lB indVer texAr ray ( vaoHandle ) ;

glDrawElements (GL_QUADS, 24 ,

GL_UNSIGNED_BYTE,

( GLvoid ∗ ) ( ( char ∗ )NULL +

g lB indVer texAr ray ( 0 ) ;

This technique allows turning large amounts of data off

and on for rendering

Issue a glBindVertexArray(0); to deactivate the

VAO until the next use