带有mapbox queryRenderedFeatures的几何图形错误

时间:2017-10-01 10:54:17

标签: mapbox geojson mapbox-gl-js

我试图用queryRenderedFeatures获取多边形的几何 在缩放级别12是可以的,但在15我得到了错误的geomentry。 这是我的代码,每次鼠标悬停时我都会得到不同的坐标。 这里https://codepen.io/benderlidze/pen/qPXNJv - 将鼠标从聚合物顶部和底部悬停。红色多边形是queryRenderedFeatures返回的几何体,它总是不同的。

 map.on("mousemove", "seatRowsFill", function(e) {

    map.getCanvas().style.cursor = 'pointer'; 
    map.setFilter("seatRowsFill-hover", ["==", "rowNumber", e.features[0].properties.rowNumber]);

    var relatedFeatures = map.queryRenderedFeatures(e.point, { layers: ['seatRowsFill'],"filter": ["==", "rowNumber", e.features[0].properties.rowNumber]  } )
    console.log(relatedFeatures["0"].geometry.coordinates["0"][2])

1 个答案:

答案 0 :(得分:1)

在缩放15处,几何图形与图块边界相交。您可以通过添加queryRenderedFeatures()https://codepen.io/stevebennett/pen/XezJNB

来查看此内容

来自['==', id, 500]的文档:

  

由于要素来自平铺的矢量数据或在内部转换为切片的GeoJSON数据,因此要素几何可能会在切片边界上分割或复制,因此,在查询结果中,要素可能会多次出现。例如,假设有一条公路穿过查询的边界矩形。查询的结果将是位于覆盖边界矩形的地图图块内的高速公路的那些部分,即使高速公路延伸到其他图块中,并且每个地图图块内的高速公路部分将作为单独的特征返回。类似地,由于图块缓冲,图块边界附近的点要素可能出现在多个图块中。

不是检索几何体然后显示它,而是通常更好地拥有一个仅用于突出显示的单独图层,然后更新该图层上的过滤器以匹配某些属性。

因此,如果您将高亮图层的过滤器更新为{{1}},那么该多边形的所有不同部分都将正确显示。

请参阅"Create a hover effect"示例。