1

我正在使用以下 javascript 函数来创建顶点数组，以便在创建形状时传递给缓冲区。它应该计算第一个顶点位于原点的 n 边正多边形的顶点。然后创建缓冲区并将其存储为传递给函数的形状对象的属性。

var vertices = [];

// Create each vertex by calculating the position of the new vertex relative
// to the old then adding on to the old position

// Begin by setting up the first vertex at the origin

vertices [0] = 0.0;
vertices [1] = 0.0;
vertices [2] = 0.0;

var oldX = 0.0;
var oldY = 0.0;

for (var i = 0; i < shape.numberOfSides; i++) {
    var theta = i * 2 * Math.PI / shape.numberOfSides;
    var y = shape.sideLength * Math.sin(theta);
    var x = shape.sideLength * Math.cos(theta);

    y += oldY;
    x += oldX;

    var start = (i+1) * 3;
    vertices [start] = x;
    vertices [start + 1] = y;
    vertices [start + 2] = 0.0;

    oldX = x;
    oldY = y;

}

// Create a buffer and store the vertices on it

shape.verticesBuffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, shape.verticesBuffer);
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);

这对三角形非常有效，但对于五边形或以上的形状并不完整——它看起来像一个新月形。我在下面包含了一个工作三角形和一个非工作六边形的屏幕截图，两者都是使用相同的功能创建的。

http://i39.tinypic.com/ndoj8z.png

谁能看到我做错了什么？

4

1 回答 1

3

绘制 1 个顶点，你应该会有一个想法 - 现在你正在这样做：

(V1, V2, V3) -> Triangle along an edge
(V2, V3, V4) -> Another triangle along an edge.
(V3, V4, V5) -> Another triangle along an edge.

当你这样做时，没有三角形穿过中心，你会得到你张贴的新月。

要正确绘制它，您需要这样做：（固定每个三角形的 1 个点，并将其他两个点移动到边缘）

(V1, V2, V3)
(V1, V3, V4)
(V1, V4, V5)

这有一个示例图像供参考：Drawing GL Polygons

于 2013-10-28T21:53:28.423 回答