Public
Edited
Nov 30, 2023
1 fork
mapboxgl = {
const gl = await require("mapbox-gl@0.49");
if (!gl.accessToken) {
gl.accessToken =
"pk.eyJ1IjoidG1jdyIsImEiOiJja3FmbGJoNXMxNmx5Mm9uejIxcmpiNjh2In0.2F8HR-8J859J7frYE6DG9g";
const href = await require.resolve("mapbox-gl@0.49/dist/mapbox-gl.css");
document.head.appendChild(html`<link href=${href} rel=stylesheet>`);
}
return gl;
}
viewof map = {
let container = html`<div style='height:400px;' />`;
// Give the container dimensions.
yield container;
// Create the \`map\` object with the mapboxgl.Map constructor, referencing
// the container div
let map = new mapboxgl.Map({
container,
center: [4.352731704711914, 50.846272321172954],
zoom: 4,
style: "mapbox://styles/mapbox/dark-v9"
});
// Wait until the map loads.
//map.on("load", () => {
//container.value = map;
//container.dispatchEvent(new CustomEvent("input"));
//});
map.on('load', () => {
map.addSource('Light', {
type: 'geojson',
data: lightData
});
// add heatmap layer here
// add circle layer here
});
}
GaN2022.csv
Type Table, then Shift-Enter. Ctrl-space for more options.
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
