Question

我正在尝试使用基于Web的应用程序Mapbox GL JS扩展具有高级过滤选项（例如，使用缩放显示数据）的Mapbox内置地图。

可用示例（https://docs.mapbox.com/mapbox-gl-js/example/filter-features-within-map-view/）使用导入的GeoJSON“ ne_10m_airports”数据，但我的数据由MySQL数据库提供。

我的JavaScript技能很有限，因此我无法更新过滤器代码以使用我的数据集。这种互动有什么建议或相关示例吗？

示例：http://www.scubacentral.net/map2.html

map.addLayer({
'id': 'airport',
'source': {
'type': 'vector',
'url': 'mapbox://mapbox.04w69w5j'
},
'source-layer': 'ne_10m_airports',
'type': 'symbol',
'layout': {
'icon-image': 'airport-15',
'icon-padding': 0,
'icon-allow-overlap': true
}
});

Answer 1

提供的示例使用了vector source。如链接的Mapbox样式规范中所述，向量源必须位于Mapbox Vector Tile format中，要从MySQL数据库生成该向量并非易事。您提到的'ne_10m_airports'数据是'url': 'mapbox://mapbox.04w69w5j'指定的向量源中的一个特定source layer。因此，此处的请求与相关的JavaScript无关，而与源数据的格式有关。

对于您的实现，GeoJSON source可能是最佳的源类型选项。这将需要编写脚本或使用其他功能将数据的结构从MySQL数据库转换为GeoJSON。如链接文档中所述，GeoJSON是一种用于表示地图数据的开放标准文件格式，并且有许多现有资源可用于根据现有数据创建GeoJSON文件。您的链接示例401中的地图由于不正确的Mapbox访问令牌，因此我无法收集有关您的特定用例的更多信息，但是无论如何，与之相比，GeoJSON源无疑将是最佳选择其他（即，如边栏here中所列举的vector，raster，raster-dem，image和video）。

Mapbox过滤器-在地图视图中过滤功能

1 个答案: