Question

我正在使用WebGL在我的地图顶部的画布层上绘制多边形以获取OSM数据。我首先绘制每个多边形的坐标点，并尝试使用gl.LINES连接这些点。我编写了一个查询（在PHP中），它返回planet_osm_polygon表中的多边形列表。它将列表作为JSON对象返回。我正在使用索引缓冲区和drawElements来绘制这样的多边形：

gl.drawElements(gl.LINES, vetexIndex.length, gl.UNSIGNED_SHORT, 0);

这是我的索引缓冲区：

pIndexBuffer = gl.createBuffer();
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, pIndexBuffer); 
pVertexIndices = new Uint16Array([0,1, 1,2, 2,3, 3,4, 4,5, 5,6, 6,7, 7,8]);
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, pVertexIndices, gl.STATIC_DRAW);

每次我尝试在单个绘图调用中绘制多边形时，只会渲染/绘制OSM表中的最后一个多边形。其他多边形从未被绘制，尽管它们的点/坐标正在从PHP-land正确传递到WebGL-land（我试图打印点）。我正在使用缩放：

function scaleMatrix(matrix, scaleX, scaleY) {
  matrix[0] *= scaleX;
  .....
  matrix[3] *= scaleX;
  matrix[4] *= scaleY;
  .....
  matrix[7] *= scaleY;
}

我的翻译是

function translateMatrix(matrix, tx, ty) {

   matrix[12] += matrix[0]*tx + matrix[4]*ty;
   matrix[13] += matrix[1]*tx + matrix[5]*ty;
   .....
   matrix[15] += matrix[3]*tx + matrix[7]*ty;
}

我在这里缺少什么？

编辑 - 我的PhP查询/代码如下所示：

$sql = "SELECT name, ST_AsText(ST_Transform(way,4326))
      FROM planet_osm_polygon
      WHERE highway IS NOT NULL
      AND ST_Intersects(way, ST_Transform(ST_MakeEnvelope((-122.302571660907),
        (37.5601802504715), (-122.436330806712),
          (37.8074531813721), 94326), 900913))";

.....
$points_collection = array();
 while($data=pg_fetch_assoc($query_result)) {

    $st_astext = $data["st_astext"];
    .....
    $points = array();
    foreach($locations as $location) {
      $tmp = explode(" ", $location);
      array_push($points ,array("lon"=>(float) $tmp[0], "lat"=> (float) $tmp[1]));
    }
    array_push($points_collection, $points);
}

现在，这将返回DB中每个位置（每行）的lat-long点。这被传递到WebGL-land。

在WebGL中，我有通常的着色器和编译着色器函数，如下链接： http://build-failed.blogspot.com/2013/02/displaying-webgl-data-on-google-maps.html

使用的所有功能与上述链接几乎相同。我只添加了额外的索引缓冲区（见上文），并将drawArrays（）修改为drawElements（）函数。现在我需要通过一次绘制调用绘制多个多边形;总是最后一个只是被画出来了。

使用WebGL

0 个答案: