Filter features outside the viewport in Mapbox

[dollysingh3192]

@mourner / @stevage

I know this question has been asked multiple times at multiple place's before and i also know that queryrenderedfeature and querysourcefeature only deals with current viewport.

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

Also, In mapbox documentation. it's been already stated that In order to get feature's outside of viewport instead of saving it in a javascript object use a geojson URL as a source.

https://docs.mapbox.com/help/troubleshooting/working-with-large-geojson-data/#store-geojson-at-url

But nothing seems to work. My Code is:

//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", ""
                            ]
                        });
                    });

but on doing something like:

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 []
});

Attaching screenshot:

NOTE: this.instance is new Map(config...) in mapbox-gl

Am I doing something wrong here or is there any other approach to get feature's from GeoJSON?

or the solution stated in below URL is the only way to loop-through GeoJSON itself?

https://stackoverflow.com/questions/56415323/javascript-filter-geojson-based-on-other-jsons-values/56415638

Please guide and Thank you in advance

[stevage]

Hey, Dolly, I'll save the Mapbox team the trouble of saying: this isn't the place to ask for support. StackOverflow is a good place.

(FWIW - yes, the correct method is fetch the geojson, then do whatever you need to do directly on that object, not through functions on map.. Please raise your question on StackOverflow if this doesn't answer it for you).

[dollysingh3192]

Added on StackOverflow and closing this task...

https://stackoverflow.com/questions/61980850/filter-features-outside-the-viewport-in-mapbox

As of current mapbox-gl version, there isn't a direct way to fetch the feature's outside of viewport. Hence, as answered by @steve-bennett, I am fetching the geojson url, save as a reference in the javascript object and applying filter on it is working for me now...

Hope it helps...

Thank you for the response..