ジオメトリのテクスチャのu座標を反転させます。
texture()が機能するためには、ジオメトリは その表面上の点を、テクスチャとして使用される長方形の画像のピクセルに マッピングする方法が必要です。座標(x, y, z)
のジオメトリの頂点は、 テクスチャ画像の座標(u, v)
のピクセルにマッピングされます。
myGeometry.uvs配列は、 ジオメトリに追加された順序で各頂点の(u, v)
座標を格納します。 myGeometry.flipU()
を呼び出すと、ジオメトリのu座標が反転し、 テクスチャが水平方向に鏡像反転して表示されます。
例えば、平面の4つの頂点は左上の角から時計回りに追加されます。 以下はmyGeometry.flipU()
を呼び出すことで、 平面のテクスチャ座標がどのように変化するかを示しています:
// 元のテクスチャ座標を表示します。 // 出力: [0, 0, 1, 0, 0, 1, 1, 1] console.log(myGeometry.uvs);
// u座標を反転させます。 myGeometry.flipU();
// 反転したテクスチャ座標を表示します。 // 出力: [1, 0, 0, 0, 1, 1, 0, 1] console.log(myGeometry.uvs);
// 変更点に注目してください: // 上部の頂点: [0, 0, 1, 0] --> [1, 0, 0, 0] // 下部の頂点: [0, 1, 1, 1] --> [1, 1, 0, 1]
実例
Notice any errors or typos? Please let us know. Please feel free to edit src/webgl/p5.Geometry.js and open a pull request!