WebGL Beginner's Guide

Using textures in a shader

Texture coordinates are exposed to the shader code in the same way that we have any other vertex attribute; no surprises here. We'll want to include a two-element vector attribute in our vertex shader that will map to our texture coordinates:

attribute vec2 aVertexTextureCoords;

Additionally, we will also want to add a new uniform to the fragment shader that uses a type we haven't seen before: sampler2D. The sampler2D uniform is what allows us to access the texture data in the shader.

uniform sampler2D uSampler;

In the past, when we've used uniforms, we have always set them to the value that we want them to be in the shader, such as a light color. Samplers work a little differently, however. The following shows how to associate ...