reduce redundant webgl attribute data

Question

If I want to draw a red and blue square using triangles without multiple draw calls, as far as I'm aware that'd be 12 elements for the shape vertices (makes sense) but I'd also need to use 12 elements for only two colors because I need to define a color for each vertex which is exponentially redundant the more vertices I use for a shape.

Is there any way to, say, skip an attribute however many times such that these line up

vertices = [0, 0, 0, 1, 1, 0, 1, 0, 0, 1, 1, 1
            1, 1, 1, 2, 2, 1, 2, 1, 1, 2, 2, 2]
colors   = [1, 0, 0, 1,
            0, 0, 1, 1]

So the first color (the first vec4 in colors) applies to the first six points in vertices and the second color applies to the next six points.

Is this possible or do I have to redefine the same color for every vertex in a shape?

Possible duplicate of [Rendering meshes with multiple indices](http://stackoverflow.com/questions/11148567/rendering-meshes-with-multiple-indices) — Nicol Bolas, Jul 30 '16 at 18:25

score 0 · Accepted Answer · answered Jul 30 '16 at 18:22

0

The closet thing to what you are after is draw instanced: http://blog.tojicode.com/2013/07/webgl-instancing-with.html.

Otherwise, if you are really keen on not duplicating vertices, you can use uniforms:

uploadAttrDataForOneShape();
setUniform("color", RED);
draw();
setUniform("color", BLUE);
draw();

Practically, memory is plentiful on GPUs, and it probably isnt worth it to stress over too much with vertex redundancy.

answered Jul 30 '16 at 18:22

WacławJasper

2,856
11
19

That's actually precisely what I'm looking for, although it's a shame it doesn't appear too consistent across WebGL implementations. – Jul 30 '16 at 20:03

reduce redundant webgl attribute data

1 Answers1