3

In this tutorial author displays a cube by defining its 6 faces (6*4 vertices) and then telling webgl about triangles in each face.

Isn't this wasteful? Wouldn't it be better to define just 8 vertices and tell webgl how to connect them to get triangles? Are colors shared by multiple vertices a problem?

To make my concern evident: if the author defines triangles with indices array, why does he need so many vertices? He could specify all triangles with just 8 vertices in the vertex array.

oOo
  • 35
  • 4

2 Answers2

5

Author of the example here. The issue is, as you suspected, to do with the colouring of the cube.

The way to understand this kind of code most easily is to think of WebGL's "vertices" as being not just simple points in space, but instead bundles of attributes. A particular vertex might be be the bundle <(1, -1, 1), red>. A different vertex that was at the same point in space but had a different colour (eg. <(1, -1, 1), green>) would be a different vertex entirely as far as WebGL is concerned.

So while a cube has only 8 vertices in the mathematical sense of points in space, if you want to have a different colour per face, each of those points must be occupied by three different vertices, one per colour -- which makes 8x3=24 vertices in the WebGL sense.

It's not hugely efficient in terms of memory, but memory's cheap compared to the CPU power that a more normalised representation would require for efficient processing.

Hope that clarifies things.

Giles Thomas
  • 6,039
  • 2
  • 33
  • 51
  • memory is cheap, true, but increase of vertex count increases time required to process them lineary (or not, I don't know how GPU does its thing). If I'm using a pixel shader for shading, then it be better to specify just 8 vertices, right? – oOo Sep 20 '11 at 17:30
  • The GPU runs through its memory reading data vertex by vertex -- that is, the vertex shader is run for each bundle of attributes one-by-one. To denormalise it you'd need a table of locations, then each vertex (in the WebGL sense) would have to say "I am location #1, with colour red" (for example). This would require non-linear memory reads (first read other attributes including location index, then read location), which would be harder to implement efficiently in the kind of low-level graphics hardware we're talking about. – Giles Thomas Sep 20 '11 at 23:44
3

You can use Vertex Buffer Objects (VBO). See this example. They create a list of Vertices and and a list of Indexes "pointing" to the vertices (no duplication of vertices).

pcantin
  • 554
  • 8
  • 17
  • "to the waist"? What does that mean? (not an english speaker) – oOo Sep 19 '11 at 18:53
  • how does this answer the question? the vbo is just a buffer containing the vertices - it doesn't somehow reduce the number of vertices needed when triangles share common points and edges. – andrew cooke Feb 23 '12 at 02:34
  • @andrew_cooke In the link (tutorial) given by oOo each vertex is duplicated three times. The example I have given defines faces by only using indexes of vertices which are (the vertices) only define once thus saving space. Using VBO is a practical way of doing that and there's plenty of example on the web. – pcantin Feb 23 '12 at 02:59
  • ok, thanks, i think i get it now after reading round some more. i hadn't understand that you can have indices into vbos. in case anyone else is confused - you first construct a "normal" vbo and then you can reference the vertices in there using an index buffer. the underlying vbo seems to be what is processed by the vertex shader, so duplicate indices are more-or-less "free". – andrew cooke Feb 24 '12 at 00:26