Question

我正在尝试使用下载的OSM数据在地图上绘制多边形。我编写了一个查询，它返回planet_osm_polygon表中的多边形列表。它将列表重新生成为JSON对象。我正在使用gl.drawArrays(gl.LINESTRIP, 0, json_data_length)绘制多边形。我已经为点做了同样的事情 - 我有一个返回的点列表，我已经能够使用gl.POINTS绘制它们。

问题是，我希望每个多边形分别绘制，但我想使用LINE_STRIP将一个多边形的一个结束点连接到另一个多边形的起始点。

例如，我希望SFO的市民中心广场和布坎南街是独立的多边形。但是，绘制后的多边形仍然通过一个点相互连接。我希望将这两个绘制为单独的多边形。我该怎么做？

我不想使用任何库。只是基本的WebGL。我的JavaScript代码从我的osm数据库获取lat-long坐标并转换为像素坐标以帮助绘图 - 请参阅链接：WebGL着色器代码（http://psousa.net/demos/webgl/）我正在使用此示例并对其进行扩展。

Answer 1

If i understood correctly you want to draw 'borders' of multiple polygons not the filled polygon itself.

In order to draw seperate lines in a single draw call you should use gl.LINES mode instead of gl.LINESTRIP.

Lets say you have a quad which has points A,B,C,D and a triangle which has points X Y Z. If you want to use glDrawArrays command with GL_LINES mode , your vertex data should be submitted as

{A,B, B,C, C,D, D,A, X,Y, Y,Z, Z,X}

Following lines are drawn with this vertex data

Line from A to B
Line from B to C
Line from C to D
Line from D to A
Line from X to Y
Line from Y to Z
Line from Z to X

In order to eliminate duplicate vertex data you can also use glDrawElements with a proper index .

使用WebGL的drawArrays

1 个答案: