2D texture coordinates have the origin at the top left as is normal for images. But they range from 0 to 1 in each direction instead of being pixel coordinates. In general, texture dimensions should be powers of two (not necessarily square, but each dimension should be a power of two). WebGL has a limited ability to handle non-power-of-two textures, but you lose some ability to tile and filter the texture.

In the fragment shader, we declare a uniform sampler2D variable and use the texture2D function to access it. One quirk on the application side is that you set the variable to the number of a “texture unit” rather than passing the texture ID directly. And you might want to bind a texture to different texture units for different draw calls. So to set the variable you have to give both the texture ID and the texture unit to which you want to bind it.

<< [View Transform] [Index] >>