oil, pump, well, derrick, gas

2f:Td8f,OdG = { const container = yield html`

`; const map = (container.value = new maplibregl.Map({ container, center: centroBasilicata, zoom: 8, style: "https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json", scrollZoom: true })); map.on('style.load', () => { // Get all layers from the current style const layers = map.getStyle().layers; // Find all label layers and hide them for (const layer of layers) { if (layer.type === 'symbol') { map.setLayoutProperty(layer.id, 'visibility', 'none'); } } }); luoghi.forEach(d=> addMarker(d, map)) invalidation.then(() => map.remove()); function addMarker (obj, map) { const coords = [obj.coordinate.lon,obj.coordinate.lat] const labelString = obj.nome const el = document.createElement('div'); const popup = new maplibregl.Popup({ closeButton: false, closeOnClick: false, offset: 15 // Lifts the tooltip slightly above the marker }).setHTML(`

${obj.nome}

${obj.descrizione || "Nessuna descrizione"}

`); // 2. Add Hover Listeners to the element el.addEventListener('mouseenter', () => { popup.setLngLat(coords).addTo(map); el.style.cursor = 'pointer'; }); el.addEventListener('mouseleave', () => { popup.remove(); }); el.style.display = 'flex'; el.style.flexDirection = 'column'; // Stack icon and text el.style.alignItems = 'center'; // Horizontal centering el.style.justifyContent = 'center'; // Vertical centering el.style.width = 'auto'; el.style.height = 'auto'; let iconString; switch(obj.categoria) { case 'Sito Industriale': iconString = iconIndustry break; case 'Sito Nucleare': iconString = iconNuclear break; case 'Pozzo': iconString = iconOil break; case 'Comune': iconString = iconPoison break; } // 2. Add your marker "Dot" const size = 15; const dot = document.createElement('div'); dot.style.display = 'flex'; dot.style.alignItems = 'center'; // Horizontal centering dot.style.justifyContent = 'center'; // Vertical centering var s = iconString?10:0; dot.style.width = `${size +s }px`; dot.style.height = `${size +s }px`; dot.style.backgroundColor = iconString? '#ffffff' : '#ff4444'; dot.style.borderRadius = '50%'; // dot.style.border = '2px solid white'; dot.style.boxShadow = '0 0 4px rgba(0,0,0,0.3)'; el.appendChild(dot); if(iconString){ const icon = document.createElement('div') icon.style.width = `${size}px`; icon.style.height = `${size}px`; icon.style.color = "white" icon.innerHTML = iconString dot.appendChild(icon); } // 3. Add your Text Label const label = document.createElement('div'); label.innerText = labelString; label.style.fontSize = '10px'; label.style.fontWeight = 'bold'; label.style.fontFamily = 'sans-serif'; label.style.color = '#333'; label.style.whiteSpace = 'nowrap'; // Add a subtle text shadow for readability on any background label.style.textShadow = '1px 1px 0 #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff'; el.appendChild(label); new maplibregl.Marker(el) .setLngLat(coords) .addTo(map); } }30:T16e3,luoghi = [ { "nome": "Viggiano", "categoria": "Pozzo", "capitolo": 5, "descrizione": "Sede del Centro Olio Val d’Agri (COVA), il più grande giacimento onshore d'Europa e cuore delle attività estrattive Eni. Area interessata da inquinamento atmosferico paragonabile a grandi metropoli.", "coordinate": { "lat": 40.3399, "lon": 15.8994 } }, { "nome": "Montemurro", "categoria": "Pozzo", "capitolo": "Costa Molina 2", "descrizione": "Ospita il pozzo di re-iniezione Costa Molina 2, utilizzato per l'immissione sotterranea di acque di scarto petrolifero. Punto critico per i rischi di sismicità indotta.", "coordinate": { "lat": 40.3014, "lon": 15.9383 } }, { "nome": "Corleto Perticara", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Sede del progetto Tempa Rossa (Total). Documentate gravi illegalità ambientali e contaminazioni da idrocarburi e piombo nel latte locale.", "coordinate": { "lat": 40.3831, "lon": 16.0411 } }, { "nome": "Melfi", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Sede dell'inceneritore Fenice-Rendina [18, 22]. Rilevata presenza di diossine nel latte materno e nei prodotti agricoli dell'area melfese [23].", "coordinate": { "lat": 40.9961, "lon": 15.6528 } }, { "nome": "Pisticci", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Ospita la piattaforma Tecnoparco Valbasento per il trattamento dei rifiuti liquidi. Presso la 'Pista Mattei' sono stati rinvenuti fusti e rifiuti interrati.", "coordinate": { "lat": 40.3908, "lon": 16.5511 } }, { "nome": "Lago del Pertusillo", "categoria": "Risorsa Idrica", "capitolo": 5, "descrizione": "Invaso artificiale strategico che fornisce acqua potabile a Basilicata e Puglia. Soggetto ad allarmi per la presenza di idrocarburi, metalli pesanti e alghe tossiche.", "coordinate": { "lat": 40.2833, "lon": 15.9667 } }, { "nome": "Ferrandina", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Parte del SIN Val Basento, ospita industrie chimiche storiche come Syndial ed ex-Liquichimica. Area interessata da sversamenti illeciti e radioattività anomala.", "coordinate": { "lat": 40.5019, "lon": 16.4550 } }, { "nome": "Melfi", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Sede dell'inceneritore Fenice-Rendina. Rilevata presenza di diossine nel latte materno e nei prodotti agricoli dell'area melfese.", "coordinate": { "lat": 40.9961, "lon": 15.6528 } }, { "nome": "Rotondella", "categoria": "Sito Nucleare", "capitolo": 6, "descrizione": "Località Trisaia, sede del centro ITREC dove sono stoccate le barre nucleari di Elk River. Citata per la mancanza di trasparenza sui rifiuti radioattivi e la falda contaminata.", "coordinate": { "lat": 40.1706, "lon": 16.5256 } }, { "nome": "Senise", "categoria": "Risorsa Idrica", "capitolo": 5, "descrizione": "Sede della diga di Monte Cotugno, dove sono stati documentati ristagni di acqua rossa e anomalie chimiche come il trimetilbenzene.", "coordinate": { "lat": 40.1472, "lon": 16.2872 } }, { "nome": "Tito", "categoria": "Area Industriale", "capitolo": 5, "descrizione": "Sito di Interesse Nazionale (SIN) caratterizzato da ritardi nelle bonifiche di estese contaminazioni industriali.", "coordinate": { "lat": 40.5847, "lon": 15.6781 } }, { "nome": "Salandra", "categoria": "Comune", "capitolo": 1, "descrizione": "Base operativa di importanti gruppi imprenditoriali legati all'indotto petrolifero e alla gestione rifiuti (Gruppo Iula).", "coordinate": { "lat": 40.5281, "lon": 16.3150 } }, { "nome": "Calvello", "categoria": "Comune", "capitolo": 5, "descrizione": "Percettore di ingenti royalties. Segnalato inquinamento da metalli pesanti nel torrente Vallone La Rossa che alimenta la diga della Camastra.", "coordinate": { "lat": 40.4764, "lon": 15.8450 } }, { "nome": "Matera", "categoria": "Area Industriale", "capitolo": 5, "descrizione": "", "coordinate": { "lat": 40.6664, "lon": 16.6044 } }, { "nome": "Guardia Perticara", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Ospita la discarica Semataf per rifiuti speciali e il futuro deposito GPL di Tempa Rossa.", "coordinate": { "lat": 40.3606, "lon": 16.1017 } }, { "nome": "Policoro", "categoria": "Comune", "capitolo": 1, "descrizione": "Rilevata presenza di trimetilbenzene nell'acqua potabile di un centro locale.", "coordinate": { "lat": 40.2081, "lon": 16.6697 } }, { "nome": "Scanzano Jonico", "categoria": "Comune", "capitolo": 2, "descrizione": "Menzionata per l'organizzazione di convegni sulla legalità ritenuti dall'autore ipocriti e legati a compromessi politici.", "coordinate": { "lat": 40.2522, "lon": 16.7119 } }, { "nome": "Gorgoglione", "categoria": "Sito Industriale", "capitolo": 5, "descrizione": "Comune interessato dalla concessione Tempa Rossa e sede di un pozzo estrattivo. Citata per l'omertà istituzionale.", "coordinate": { "lat": 40.3956, "lon": 16.1478 } }, { "nome": "Grumento Nova", "categoria": "Comune", "capitolo": 5, "descrizione": "Comune limitrofo al COVA. Lo studio VIS ha accertato nell'area un aumento della mortalità e delle ospedalizzazioni.", "coordinate": { "lat": 40.2869, "lon": 15.8886 } }, { "nome": "Marsico Nuovo", "categoria": "Comune", "capitolo": 2, "descrizione": "Area interessata dalla presenza di pozzi e dal passaggio delle condotte di trasporto idrocarburi verso il COVA.", "coordinate": { "lat": 40.4231, "lon": 15.7336 } } ] 31:T83d,iconIndustry = ``32:T4fb,iconNuclear = ``33:T4d0,iconPoison = ``34:T508,iconOil = ``35:[] 2d:{"title":"Mappa","cells":[{"id":0,"value":"# Mappa\n\nLuoghi che riguardano eventi relativi all'inquinamento e all'attività petrolifera in Basilicata.\n\nPassa sopra con il mouse per ulteriori informazioni.","pinned":false,"hidden":false,"mode":"md"},{"id":4,"value":"$2f","pinned":false,"hidden":false,"mode":"ojs"},{"id":42,"value":"## Coordinate","pinned":false,"hidden":false,"mode":"md"},{"id":145,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":34,"value":"centroBasilicata = [16.275651,40.4600033]","pinned":false,"hidden":false,"mode":"ojs"},{"id":47,"value":"### Imports","pinned":false,"hidden":false,"mode":"md"},{"id":117,"value":"import {getIconSvg} from '@saneef/feather-icons'","pinned":true,"hidden":false,"mode":"ojs"},{"id":6,"value":"maplibregl = require(\"maplibre-gl@2.1.9\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":17,"value":"html``","pinned":true,"hidden":false,"mode":"ojs"},{"id":188,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":192,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":241,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":248,"value":"$34","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W35","stdlib":"1","titling":"auto"}