javascript - 在 Mapbox 的视口(viewport)之外过滤功能

标签 javascript mapbox mapbox-gl

我有一个包含大约 100K 特征的巨大 geojson 文件,我想在视口(viewport)之外过滤特征。我尝试了多种方法:

https://github.com/mapbox/mapbox-gl-js/issues/8350

https://gis.stackexchange.com/questions/300292/how-to-load-geojson-features-outside-view-with-mapbox-gl?rq=1

但似乎没有任何效果。
我的代码是:

//Here i have already added empty geojson source
 this.instance.addSource('seats_geojson', {
            type: 'geojson',
            data: {
                "type": "FeatureCollection",
                "features": []
            }
        });

//Here i have axios call with await and i am getting all the feature's in console
//console.log(e.data.featuresCollection.features) <--- 100K features

this.instance.once('idle', () => {                      

          //Once i have the reponse ready I am setting source using setData
          this.instance.getSource('seats_geojson').setData(e.data.featuresCollection);


          //Here i am creating empty layer with above source
                         this.instance.addLayer({
                         id: "rowSelectionDup",
                         type: 'circle',
                            source: 'seats_geojson',
                            paint: {
                                'circle-color': "#4400d9"
                            },
                            filter: [
                                "in", "s", ""
                            ]
                        });
                    });

但在做类似的事情:
this.instance.querySourceFeatures('seats_geojson', {
  sourceLayer: 'rowSelectionDup',
  filter: ['in', 's', "1C"] //This section "s" 1C is in viewport and i am getting 207 feature's
});
this.instance.querySourceFeatures('seats_geojson', {
  sourceLayer: 'rowSelectionDup',
  filter: ['in', 's', "7C"]. //This section is outside viewport and result is []
});


注意:this.instance 是 mapbox-gl 的 map 实例(new Map(config....))

我在这里做错了吗?

还是有其他方法可以从geojson 获取功能?

先感谢您...

最佳答案

当我在 mapbox-gl Github 上发布这个问题时:

https://github.com/mapbox/mapbox-gl-js/issues/9720

在当前的 mapbox-gl 版本中,没有直接的方法来获取视口(viewport)之外的功能。因此,正如@steve-bennett 所回答的那样,我正在获取geojson url,保存为javascript oject 中的引用并对其应用过滤器现在对我有用...

希望能帮助到你...

关于javascript - 在 Mapbox 的视口(viewport)之外过滤功能,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61980850/

相关文章:

javascript - Laravel 5 - 在 Javascript 中解密 Crypt::encrypt

javascript - 对象*名称*没有方法*方法名称*

Javascript addEventListener 在 3 个链接上,只有 1 个有效

java - 如何将 Mapbox GL Native Android Activity 示例 Java 应用程序翻译成 NativeScript?

ios - 构建谓词 (NSExpression) 以确定 Mapbox SymbolStyle 图层的图标颜色

ios - 除非用户先在 map 上移动,否则 Mapbox iOS 的 flyToCamera 会一直回到初始位置

javascript - 如何将函数连接到 windows.onclick?

javascript - 禁用 map 框上的滚动缩放

mapbox-gl - Mapbox GL 3D 单体建筑高光选择