Search code examples
geojsonmapbox-gl-jsvector-tiles

How to display a huge GeoJSON file to the MapBox?


I'm new in MapBox GL Js and I want to call a big GeoJSON file over https and display it to the map. I think that calling vector Tile is the best way to do that, I found some tutorials that show how to convert your GeoJSON data to Vector Tile but on Server Side or upload it to the MapBox Style but my GeoJSON file is frequently changing. So I found this solution is a new JavaScript library called geojson-vt, describing how to convert a huge GeoJSON files to vector tile on the fly (Client Side) with crazy fast, It's seems like what I'm looking for, BUT !!, How can I integrate it to the MapBox GL JS for calling the layer ??

Blocking on How can I add Layer using Mapbox GL JS with the following result : var tileIndex = geojsonvt(MyGeoJSON); var tile = tileIndex.getTile(z, x, y);

... Or I just didn't get it ! Please somebody helps or can propose some other solution for my problem.


Solution

  • You don't need to worry about geojson-vt. Mapbox-GL-JS does that internally. So you can just follow the standard documentation for loading a GeoJSON layer.

    If your GeoJSON is really huge, then probably the limiting factor will be network transfer, which means you really need to be serving server-side vector tiles.