Flips the geometry’s texture v-coordinates.
In order for texture() to work, the geometry needs a way to map the points on its surface to the pixels in a rectangular image that's used as a texture. The geometry's vertex at coordinates (x, y, z)
maps to the texture image's pixel at coordinates (u, v)
.
The myGeometry.uvs array stores the (u, v)
coordinates for each vertex in the order it was added to the geometry. Calling myGeometry.flipV()
flips a geometry's v-coordinates so that the texture appears mirrored vertically.
For example, a plane's four vertices are added clockwise starting from the top-left corner. Here's how calling myGeometry.flipV()
would change a plane's texture coordinates:
// Print the original texture coordinates.
// Output: [0, 0, 1, 0, 0, 1, 1, 1]
console.log(myGeometry.uvs);
// Flip the v-coordinates.
myGeometry.flipV();
// Print the flipped texture coordinates.
// Output: [0, 1, 1, 1, 0, 0, 1, 0]
console.log(myGeometry.uvs);
// Notice the swaps:
// Left vertices: [0, 0] <--> [1, 0]
// Right vertices: [1, 0] <--> [1, 1]
<!------><!------>
Examples
Notice any errors or typos? Please let us know. Please feel free to edit src/webgl/p5.Geometry.js and open a pull request!