world = { const container = yield html`

`; const map = (container.value = new maplibregl.Map({ boxZoom: true, pitch: 0, bearing: 0, maplibreLogo: true, container, center: [2.3374205901589185, 48.8581402090239], zoom: 12, style: bright_new, scrollZoom: true })); map.addControl(new maplibregl.NavigationControl()); map.on("load", () => { map.addSource("points", { type: "geojson", data: aggregatedPoints }); map.addLayer({ id: "points", type: "circle", source: "points", paint: { "circle-color": [ "case", ["in", "président", ["downcase", ["get", "fonction"]]], "#e41a1c", ["in", "premier", ["downcase", ["get", "fonction"]]], "#377eb8", "#888888" ], "circle-opacity": 0.65, "circle-stroke-width": 1, "circle-stroke-color": "#ffffff", "circle-radius": [ "interpolate", ["linear"], ["get", "count"], 1, 4, 5, 8, 20, 16, 60, 28, 150, 40 ] } }); const onClick = (e) => { const feature = e.features && e.features[0]; if (!feature) return; const coordinates = feature.geometry.coordinates.slice(); const p = feature.properties ?? {}; const safe = (v) => (v ?? "").toString(); let list = []; if (Array.isArray(p.individus)) list = p.individus; else if (typeof p.individus === "string") { try { const x = JSON.parse(p.individus); if (Array.isArray(x)) list = x; } catch {} if (!list.length && p.individus.includes(",")) list = p.individus.split(",").map(s => s.trim()).filter(Boolean); if (!list.length && p.individus.trim()) list = [p.individus.trim()]; } const shown = list.slice(0, 8); const more = list.length > 8 ? ` +${list.length - 8}` : ""; const html = `

${safe(p.lieu)} (${safe(p.pays)})

${safe(p.fonction)}

${safe(p.count)} visites

${shown.length ? `

Individus : ${shown.map(safe).join(", ")}${more}

` : ""}

`; while (Math.abs(e.lngLat.lng - coordinates[0]) > 180) { coordinates[0] += e.lngLat.lng > coordinates[0] ? 360 : -360; } new maplibregl.Popup() .setLngLat(coordinates) .setHTML(html) .addTo(map); }; map.on("click", "points", onClick); map.on("mouseenter", "points", () => { map.getCanvas().style.cursor = "pointer"; }); map.on("mouseleave", "points", () => { map.getCanvas().style.cursor = ""; }); }); invalidation.then(() => map.remove()); return container; }