CODEWITHSUNDEEP
angularmapboxmapbox-gl
ganggaroo
ganggaroo

Reputation: 83

mapbox addSource data type

While using mapbox.I tried to load layer from variable geojson . but they occurred 404 error. addSource data always regards data as url. Is there any way regard data as variables?

this.map.on('load', () => {
  const layers = this.map!.getStyle().layers;
  const labelLayerId = layers.find(
    (layer) => layer.type === 'symbol' && layer.layout!['text-field']
  )!.id;
  const geojson = '{"type": "FeatureCollection","features": [...some data]}';
  this.map!.addSource('chungbuk-data-source', {
    type: 'geojson',
    data: geojson
  });

Upvotes: 0

Views: 172

Answers (1)

Dessus
Dessus

Reputation: 2177

I believe what you want to do would be achievable via creating a url for a variable object. More information here: https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL_static

The browser creates a url that is localhost like but is only accessible within the current execution context (ie other browser tabs can't use it) allowing variables in javascript to be url visible.

So in your example you would want something like this:


  const geojson = '{"type": "FeatureCollection","features": [...some data]}';
  this.map!.addSource('chungbuk-data-source', {
    type: 'geojson',
    data: URL.createObjectURL(geojson)
  });

Upvotes: 0

Related Questions