javascript - Mapbox queryRenderedFeatures vid laddning


Jag skulle vilja använda queryRenderedFeatures efter att sidan har laddats för att fylla en lista, men det verkar fortsätta köras innan lagret har laddats. Jag får felmeddelandet i konsolen nedan:

The layer 'Points' does not exist in the map's style and cannot be queried for features.

Hur kan jag göra en fråga på lagret efter att objektet har laddats? Jag försökte följa förslagen i dessa svar men det fortsätter att returnera tomt

JavaScript som körs efter att sidan har laddats

anropa en funktion efter att hela sidan har laddats

Det här är vad jag har just nu

map.on('load', function() {
  map.addLayer({
      'id': 'Points',
      'type': 'circle',
      'source': 'Points-45d56v',
      'source-layer': 'Points-45d56v',
      'layout': {
          'visibility': 'visible',
      },
      'paint': {
        'circle-radius': 6,
        'circle-color': 'red'
      }
  });
});

$(document).ready(function(){
  var features = map.queryRenderedFeatures({layers:['Points']});
  console.log(features);
});

Svar #1

Jag fick följande kod från Github-länken i det föregående svaret, vilket fungerade för mig:

map.addLayer(...) // make your change
map.on('render', afterChangeComplete); // warning: this fires many times per second!

function afterChangeComplete () {
  if (!map.loaded()) { return } // still not loaded; bail out.

  // now that the map is loaded, it's safe to query the features:
  map.queryRenderedFeatures(...);

  map.off('render', afterChangeComplete); // remove this handler now that we're done.
}

Se till att sätta det i samma map.on('load', function() {}); som lagret som ska frågas.

Svar #2

Från https://github.com/mapbox/mapbox-gl-js/issues/4222#issuecomment-279446075:

Du kan kontrollera map.loaded() (https://www.mapbox.com/mapbox-gl-js/api/#map#loaded) för att avgöra om kartan är laddad och det är säkert att fråga efter funktionerna.

För exempel på kod, se den länkade kommentaren på GitHub-ärendet.