How to use 32 bit Integers for Element Indices in WebGL 1.0?

Question

WebGL 1.0 specification does not allow to create 32-bit index buffers. Now I'm in trouble, I'm trying to render huge objects with 100 thousands to 1 million indices. In OpenGL this is no issue at all, and I think it will be no issue in WebGL too, in most cases.

I am not able to split my data into smaller subsets as I'm already working with split data sets and can't divide it further without breaking up my full program logic.

Now I came across a new extension for WebGL from 2012, OES_element_index_uint, which looks like it enables unsigned integers (32 bit) for drawElements calls.

/* draw geometry lines by indices */
gl.drawElements(gl.LINES, getIndexBuffer().length, gl.UNSIGNED_INT, idxBuffer);

But when I try to use the gl.UNSIGNED_INT I run into the following error:

Error: WebGL: drawElements: Invalid `type`: 0x1405
uncaught exception: gl.INVALID_ENUM was caused by call to drawElements

How to use 32 bit Integers for Element Indices in WebGL 1.0? How to enable this extension in Chrome or Firefox?

Does this mean in general such a call won't be compatible with most devices running WebGL 1.0?

Answer 1

Enabling the extension is as simple as:

var uints_for_indices = gl.getExtension("OES_element_index_uint");

if uints_for_indices is null then the extension is not available and you'll have to split your data anyway.

If it's not null then you can now pass gl.UNSIGNED_INT for the index type into gl.drawElements.