Using the Data / Maps

2D / 3D Rendering

The full district-boundary collection is a standard GeoJSON FeatureCollection. Use it with Leaflet, MapLibre, Mapbox GL, D3, deck.gl, or QGIS.

2D with Leaflet

fetch('geojson/districts.geojson.txt')
  .then(res => res.json())
  .then(data => L.geoJSON(data, {
    style: { color: '#006A4E', weight: 1, fillOpacity: 0.5 },
    onEachFeature: (feature, layer) =>
      layer.bindPopup(feature.properties.ADM2_EN)
  }).addTo(map));

3D with deck.gl

new GeoJsonLayer({
  id: 'bd-districts',
  data: 'geojson/districts.geojson.txt',
  extruded: true,
  pickable: true,
  getElevation: feature => feature.properties.metric ?? 20000,
  getFillColor: [15, 157, 88, 180]
});
Large file note: The complete 64-feature boundary file is loaded on demand. Keep it as a static asset and cache it at the edge instead of embedding it in the page.