files/en-us/web/api/webgl2renderingcontext/vertexattribipointer/index.md
{{APIRef("WebGL")}}{{AvailableInWorkers}}
The WebGL2RenderingContext.vertexAttribIPointer() method
of the WebGL 2 API specifies integer data
formats and locations of vertex attributes in a vertex attributes array.
vertexAttribIPointer(index, size, type, stride, offset)
index
size
type
gl.BYTE, gl.UNSIGNED_BYTE,
gl.SHORT, gl.UNSIGNED_SHORT, gl.INT, or
gl.UNSIGNED_INT.stride
offset
type.None ({{jsxref("undefined")}}).
Very similar to {{domxref("WebGLRenderingContext.vertexAttribPointer()")}}. The main
difference is that while values specified by vertexAttribPointer are
always interpreted as floating-point values in the shader (even if they were originally
specified as integers in the buffer), this method allows specifying values which are
interpreted as integers in the shader.
// Describe the layout of the buffer:
// 1. position
gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 20, 0);
gl.enableVertexAttribArray(0);
// 2. bone weights, normalized to [0, 1]
gl.vertexAttribPointer(1, 4, gl.UNSIGNED_BYTE, true, 20, 12);
gl.enableVertexAttribArray(1);
// 3. bone indices, interpreted as integer
gl.vertexAttribIPointer(2, 4, gl.UNSIGNED_BYTE, 20, 16);
gl.enableVertexAttribArray(2);
// Connect to attributes from the vertex shader
gl.bindAttribLocation(shaderProgram, 0, "position");
gl.bindAttribLocation(shaderProgram, 1, "boneWeights");
gl.bindAttribLocation(shaderProgram, 2, "boneIndices");
<script id="shader-vs" type="x-shader/x-vertex">
#version 300 es
uniform mat4 mvMatrix;
uniform mat4 bones[120];
in vec3 position;
in vec4 boneWeights;
in uvec4 boneIndices;//read as 4-component unsigned integer
void main() {
vec4 skinnedPosition =
bones[boneIndices.s] * vec4(position, 1.0) * boneWeights.s +
bones[boneIndices.t] * vec4(position, 1.0) * boneWeights.t +
bones[boneIndices.p] * vec4(position, 1.0) * boneWeights.p +
bones[boneIndices.q] * vec4(position, 1.0) * boneWeights.q;
gl_Position = mvMatrix * skinnedPosition;
}
</script>
{{Specifications}}
{{Compat}}