Opengl es WebGL修复网格中没有重复顶点的单元纹理

我正在使用WebGL编写一个web应用程序，其中我创建了一个顶点网格，它被组装成四边形，有点像网格

这就是它看起来的样子，完全有纹理

它工作正常，但有一个问题。纹理是以下8x8图像，带有两个箭头，一个向左，一个向上

此时，您可能已经意识到纹理会根据顶点在所有方向上翻转

我使用以下省道代码创建顶点。不过，对于javascript开发人员来说，这应该不会太难做到

    vertices = new Float32List(verts * ChunkRenderer.FLOATS_PER_VERTEX);

    for (int i = 0; i < w + 1; i++) {
        for (int j = 0; j < h + 1; j++) {
            int index = (i + j * (w + 1)) * ChunkRenderer.FLOATS_PER_VERTEX;

            double x = i * 16.0;
            double z = j * 16.0;
            double y = 0.0;

            double r = rand.nextDouble();
            double g = rand.nextDouble();
            double b = rand.nextDouble();

            double u = i % 2 == 0 ? 0.0 : 1.0;
            double v = j % 2 == 0 ? 0.0 : 1.0;

            vertices.setAll(index, [
                x, y, z,
                   u, v,
                r, g, b,
            ]);
        }
    }

有没有一种方法可以在不破坏纹理的情况下重用每个三角形的顶点，或者我真的需要为每个单元复制顶点

我喜欢当前的设置，因为我可以向上移动一个顶点，如果你愿意，它会创建一个“尖峰”。如果每个单元都有自己的顶点，我必须更新4个不同的顶点以获得相同的效果（当然不包括网格边上的顶点）

---

谢谢

您可以为每个顶点提供4对（U，V），然后决定使用哪一对

---

我不知道您的渲染代码，因此很难提供任何示例。

您可以为每个顶点提供4对（U，V），然后决定使用哪一对

---

我不知道您的渲染代码，因此很难提供任何示例。

我认为最基本的重用形式是为一个四边形准备网格数据，然后为每个绘制调用使用不同的平移和旋转信息重新绘制该四边形。由于额外的绘制调用，这将大大降低性能，但也需要更少的内存。

我认为最基本的重用形式是为一个四边形准备网格数据，然后为每个绘制调用使用不同的平移和旋转信息重绘该四边形。由于额外的抽签调用，这将比您正在执行的操作的性能显著降低，但也需要更少的内存。

昨天在发布此问题后不久，我就有了这个想法，但后来我意识到，着色器应该如何知道要使用哪一对呢？如果你一个接一个地绘制四边形，你可以添加一个统一体来指示你正在绘制的四边形。如果你使用实例渲染，你可以用这些数据创建额外的缓冲区。昨天我在发布这个问题后不久就有了这个想法，但后来我意识到，着色器应该如何知道要使用哪一对呢？如果你一个接一个地绘制四边形，你可以添加一个统一体来指示你正在绘制的四边形。如果使用实例渲染，则可以使用此数据创建额外的缓冲区。

double u = i % 2 == 0 ? 0.0 : 1.0;
double v = j % 2 == 0 ? 0.0 : 1.0;