A simple map

Here we follow the getting started example to create a map with a starting camera location and one of the default map styles.

Map styles can be edited online using the Mapbox Studio editor.

This cell creates the interactive GL map view and returns the map object that can be used to interact with the data and layers via the Mapbox GL JS API.

`; container.appendChild(leftPane); container.appendChild( html`

` ); yield container; // Inititalize the GL map let map = new mapboxgl.Map({ container: 'map', // container id style: 'mapbox://styles/mapbox/light-v10', // stylesheet location center: [24.9103, 60.2280], zoom: 13 }); // Wait until the map loads. map.on("load", () => { map.addSource('reveal-points', { type: 'geojson', data: { type: "FeatureCollection", features: [] } }); map.addLayer(mapLayers['reveal-heatmap']); container.value = map; container.dispatchEvent(new CustomEvent("input")); }); // Be careful to clean up the map's resources using \`map.remove()\` whenever // this cell is re-evaluated. invalidation.then(() => map.remove()); }