Changes the coordinate system used for textures when they’re applied to custom shapes.
In order for texture() to work, a shape needs a way to map the points on its surface to the pixels in an image. Built-in shapes such as rect() and box() already have these texture mappings based on their vertices. Custom shapes created with vertex() require texture mappings to be passed as uv coordinates.
Each call to vertex() must include 5 arguments, as in vertex(x, y, z, u, v), to map the vertex at coordinates (x, y, z) to the pixel at coordinates (u, v) within an image. For example, the corners of a rectangular image are mapped to the corners of a rectangle by default:
// Apply the image as a texture. texture(img); <p>// Draw the rectangle. rect(0, 0, 30, 50); </p>If the image in the code snippet above has dimensions of 300 x 500 pixels, the same result could be achieved as follows:
// Apply the image as a texture. texture(img); <p>// Draw the rectangle. beginShape();</p> <p>// Top-left. // u: 0, v: 0 vertex(0, 0, 0, 0, 0);</p> <p>// Top-right. // u: 300, v: 0 vertex(30, 0, 0, 300, 0);</p> <p>// Bottom-right. // u: 300, v: 500 vertex(30, 50, 0, 300, 500);</p> <p>// Bottom-left. // u: 0, v: 500 vertex(0, 50, 0, 0, 500);</p> <p>endShape(); </p>textureMode() changes the coordinate system for uv coordinates.
The parameter, mode, accepts two possible constants. If NORMAL is passed, as in textureMode(NORMAL), then the texture’s uv coordinates can be provided in the range 0 to 1 instead of the image’s dimensions. This can be helpful for using the same code for multiple images of different sizes. For example, the code snippet above could be rewritten as follows:
// Set the texture mode to use normalized coordinates. textureMode(NORMAL); <p>// Apply the image as a texture. texture(img);</p> <p>// Draw the rectangle. beginShape();</p> <p>// Top-left. // u: 0, v: 0 vertex(0, 0, 0, 0, 0);</p> <p>// Top-right. // u: 1, v: 0 vertex(30, 0, 0, 1, 0);</p> <p>// Bottom-right. // u: 1, v: 1 vertex(30, 50, 0, 1, 1);</p> <p>// Bottom-left. // u: 0, v: 1 vertex(0, 50, 0, 0, 1);</p> <p>endShape(); </p>By default, mode is IMAGE, which scales uv coordinates to the dimensions of the image. Calling textureMode(IMAGE) applies the default.
Note: textureMode() can only be used in WebGL mode.
Examples
Syntax
textureMode(mode)Parameters
either IMAGE or NORMAL.