CODEWITHSUNDEEP
javascriptwebglrenderingmesh
XCS
XCS

Reputation: 28177

WebGL update dynamic meshes

I have a collection of verticies (a mesh) that is updated each frame, think of a flower that grows and has to be drawn on the screen.

I currently render the mesh by binding the Float32Array, that containins the mesh verticies, each tick, so each frame the buffer is uploaded to the GPU.

Is there any way to update the mesh without re-uploading the buffer? Each frame contains the new points that are added and the old points that stay the same, is there any "gl_pushVerticies" method?

Upvotes: 2

Views: 777

Answers (1)

Jeroen van Langen
Jeroen van Langen

Reputation: 22083

The line "Each frame contains new points are added and the old points stay the same" **is the key here......

As a part of the 'flower' stays the same and 'new' vertices are added, I would create one big vertex buffer with all vertices (all parts) in it (the complete flower) and draw it partially by using the count of (for example) void gl.drawElements(mode, count, type, offset);

This way you don't need to manipulate any vertex buffer.

For example using indices

// create the vertex buffer with all vertices (complete object)
// for example 56 vertices

frame1:

// instead of drawing the complete object, you draw only 24 vertices
gl.drawArrays(gl.TRIANGLES, 24, 0);

frame2:

// instead of drawing the complete object, you draw only 48 vertices
gl.drawArrays(gl.TRIANGLES, 48, 0);

frame3:

// instead of drawing the complete object, you draw only 56 vertices
gl.drawArrays(gl.TRIANGLES, 56, 0);

etc.....

Upvotes: 1

Related Questions