Public
Edited
Dec 6
Insert cell
Insert cell
// Lien vers la bibliothèque
L = require('leaflet');
Insert cell
// Lien vers la feuille de styles CSS
html`<link href='${resolve('leaflet@1.2.0/dist/leaflet.css')}' rel='stylesheet' />`
Insert cell
// Fond GeoJSON en fichier attaché
tlsemetro = FileAttachment("tlsemetro.geojson").json();
Insert cell
// La carte
map = {
// Création du <div> conteneur de la carte
let container = DOM.element('div', { style: `width:${width}px;height:${width/1.6}px` });
// Rendu du conteneur pour qu'il se dimensionne avant que Leaflet ne dessine la carte
yield container;
// Création de la carte avec une couche OSM issue de MapBox (token privé limité)
let map = L.map(container).setView([43.64, 1.45], 11);
let osmLayer = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '&copy; <a href="https://openstreetmap.org/copyright">OpenStreetMap contributors</a>'
}).addTo(map);
// Ajout d'une couche d'entités GeoJSON provenant d'un fichier attaché
let tm = L.geoJSON(tlsemetro, {style: {color: '#FF2222'}}).addTo(map);

}
Insert cell
Insert cell
// Inspiré de https://observablehq.com/@tmcw/leaflet
Insert cell

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.
Learn more