From 3e1dff852606131e238ac4eb01845f2218b073cd Mon Sep 17 00:00:00 2001 From: Marcrb3 Date: Thu, 18 Jul 2024 14:22:08 +0200 Subject: [PATCH] add temperature & precipitation --- dist/assets/index-BkPAiMsi.js | 4 ++++ dist/assets/index-oJ0Wf6Mg.js | 4 ---- dist/index.html | 2 +- src/main.js | 28 +++++++++++++++------------- 4 files changed, 20 insertions(+), 18 deletions(-) create mode 100644 dist/assets/index-BkPAiMsi.js delete mode 100644 dist/assets/index-oJ0Wf6Mg.js diff --git a/dist/assets/index-BkPAiMsi.js b/dist/assets/index-BkPAiMsi.js new file mode 100644 index 0000000..56e1818 --- /dev/null +++ b/dist/assets/index-BkPAiMsi.js @@ -0,0 +1,4 @@ +(function(){const n=document.createElement("link").relList;if(n&&n.supports&&n.supports("modulepreload"))return;for(const l of document.querySelectorAll('link[rel="modulepreload"]'))s(l);new MutationObserver(l=>{for(const o of l)if(o.type==="childList")for(const i of o.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&s(i)}).observe(document,{childList:!0,subtree:!0});function r(l){const o={};return l.integrity&&(o.integrity=l.integrity),l.referrerPolicy&&(o.referrerPolicy=l.referrerPolicy),l.crossOrigin==="use-credentials"?o.credentials="include":l.crossOrigin==="anonymous"?o.credentials="omit":o.credentials="same-origin",o}function s(l){if(l.ep)return;l.ep=!0;const o=r(l);fetch(l.href,o)}})();var e,v;let A="",F=!0,b,h=null,M,S="#000000";const O={top:60,bottom:window.innerHeight*.5+25,left:60,right:60},R={top:100,bottom:100,left:300,right:50};async function G(){const n=document.getElementById("serveiSelector2").value;let r=null,s=null;if(e.getLayer("clicked-layer")){const o=e.getSource("clicked-layer");o&&o._data&&(r=o._data,e.getLayer("clicked-layer-labels")&&(s=o._data))}let l;n==="orto"?(l="https://geoserveis.icgc.cat/contextmaps/icgc_orto_estandard.json",S="#FFFFFF"):n==="topo"?(l="https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard_general.json",S="#000000"):n==="fosc"&&(l="https://geoserveis.icgc.cat/contextmaps/icgc_mapa_base_fosc.json",S="#FFFFFF"),e.setStyle(l),e.once("styledata",()=>{const o=_(e.getStyle().layers),i=localStorage.getItem("clickedLayerColor")||"#f9f91d";r&&(e.getSource("clicked-layer")||e.addSource("clicked-layer",{type:"geojson",data:r}),e.getLayer("clicked-layer")||e.addLayer({id:"clicked-layer",type:"fill",source:"clicked-layer",layout:{},paint:{"fill-color":i,"fill-outline-color":i,"fill-opacity":.5}},o),s&&(e.removeLayer("clicked-layer"),e.getLayer("clicked-layer-labels")||(e.addLayer({id:"clicked-layer",type:"circle",source:"clicked-layer",paint:{"circle-radius":8,"circle-color":i}}),e.addLayer({id:"clicked-layer-labels",type:"symbol",source:"clicked-layer",layout:{"text-field":["get","Codi_ICC"],"text-font":["Arial-Bold"],"text-size":12,"text-offset":[0,1.5],"text-anchor":"top"},paint:{"text-color":S}})))),n==="topo"?e.setSky({"sky-color":"#a5f0f0","sky-horizon-blend":.3,"horizon-color":"#e1e3e3","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#c5d6d6"}):n==="orto"?e.setSky({"sky-color":"#37709e","sky-horizon-blend":.3,"horizon-color":"#e1e3e3","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#c5d6d6"}):n==="fosc"&&e.setSky({"sky-color":"#232423","sky-horizon-blend":.3,"horizon-color":"#969996","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#383838"}),$().then(function(){q()})})}async function $(){e.getSource("terrainMapZen")||e.addSource("terrainMapZen",{type:"raster-dem",url:"https://s3.amazonaws.com/elevation-tiles-prod/terrarium/{z}/{x}/{y}.png",tileSize:512,maxzoom:14})}function q(){try{e.setTerrain({source:"terrainMapZen",exaggeration:1.5})}catch(t){console.log("ERROR addTerrain"),console.log(t)}}function P(){e.getLayer("clicked-layer")&&e.removeLayer("clicked-layer"),e.getLayer("clicked-layer-labels")&&e.removeLayer("clicked-layer-labels"),e.getSource("clicked-layer")&&e.removeSource("clicked-layer")}function W(t){const n=_(e.getStyle().layers);e.getLayer("hovered-layer")&&e.removeLayer("hovered-layer"),e.getSource("hovered-layer")&&e.removeSource("hovered-layer");for(let r=0;r${c.etiqueta} (distància: ${c.distancia} km)

`),p&&(s.innerHTML+=`Coordenades: ${t.toFixed(5)}, ${n.toFixed(5)}
`,s.innerHTML+=`Elevació: ${p} metres
`,(d||y)&&(s.innerHTML+=`Temperatura mijana anual: ${d.toFixed(2)} ºC
`,s.innerHTML+=`Precipitació mijana anual: ${y.toFixed(2)} mm

`));for(let a=0;a{h=f,B(f,u)}),u.addEventListener("mouseover",()=>{W(f)}),u.addEventListener("mouseout",()=>{Z()}),s.appendChild(u),s.appendChild(document.createElement("br"))}i.length>0&&!h?setTimeout(()=>{h=i[0],B(h,s.querySelector(".myButtonClass"))},25):h&&document.querySelectorAll(".myButtonClass").forEach(f=>{f.textContent.includes(h)&&B(h,f)})}j()}function B(t,n){const r=_(e.getStyle().layers);P();const s=document.querySelector(".closeButtonClass");s&&s.parentNode.removeChild(s);let l=new maplibregl.LngLatBounds;for(let c=0;c{const C=L.geometry.coordinates;C&&C.length===2&&typeof C[0]=="number"&&typeof C[1]=="number"&&l.extend(C);const I=L.properties;I&&(g.forEach(x=>{if(I[x]!==void 0){const w=document.createElement("div");if(x==="Enllaç"){const E=document.createElement("a"),D=I[x];E.href=D,E.textContent="Fitxa ↓",E.target="_blank",E.classList.add("button-link"),w.appendChild(E)}else w.textContent=`${x}: ${I[x]}`;d.appendChild(w)}}),d.appendChild(document.createElement("br")))})}else{const u=b[c].geometry;if(u){e.addSource("clicked-layer",{type:"geojson",data:{type:"Feature",geometry:u,properties:{}}}),e.addLayer({id:"clicked-layer",type:"fill",source:"clicked-layer",layout:{},paint:{"fill-color":p,"fill-outline-color":p,"fill-opacity":.5}},r),u.type==="Polygon"?u.coordinates[0].forEach(m=>{m&&m.length===2&&typeof m[0]=="number"&&typeof m[1]=="number"&&l.extend(m)}):u.type==="MultiPolygon"&&u.coordinates.forEach(m=>{m[0].forEach(g=>{g&&g.length===2&&typeof g[0]=="number"&&typeof g[1]=="number"&&l.extend(g)})});const k=b[c].properties;if(k)for(const[m,g]of Object.entries(k)){const L=document.createElement("div");L.textContent=`${m}: ${g}`,d.appendChild(L)}}}document.querySelectorAll(".layer-properties").forEach(u=>u.remove());const a=document.createElement("button");a.textContent="×",a.classList.add("closeButtonClass"),a.addEventListener("click",()=>{P(),d.remove(),a.remove(),n.classList.remove("highlighted-button")}),d.appendChild(a),n&&(n.parentNode.insertBefore(d,n.nextSibling),n.parentNode.insertBefore(a,n.nextSibling)),document.querySelectorAll(".myButtonClass").forEach(u=>u.classList.remove("highlighted-button")),n.classList.add("highlighted-button")}const i=window.innerWidth<750?O:R;l.isEmpty()||e.fitBounds(l,{padding:i})}function J(){Y(),e=new maplibregl.Map({container:"map",style:"https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard_general.json",center:[2.0042,41.7747],zoom:7,maxZoom:18,attributionControl:!1,hash:!1,maxPitch:85}),e.on("load",function(){$().then(function(){q()}),e.addControl(new maplibregl.NavigationControl,"top-right"),e.setSky({"sky-color":"#a5f0f0","sky-horizon-blend":.3,"horizon-color":"#e1e3e3","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#c5d6d6"});let t=null;const n=20,r=new maplibregl.GeolocateControl({positionOptions:{enableHighAccuracy:!0},trackUserLocation:!0});e.addControl(r,"top-right");function s(l,o,i,c){const d=(i-l)*Math.PI/180,y=(c-o)*Math.PI/180,a=Math.sin(d/2)*Math.sin(d/2)+Math.cos(l*Math.PI/180)*Math.cos(i*Math.PI/180)*Math.sin(y/2)*Math.sin(y/2);return 6371e3*(2*Math.atan2(Math.sqrt(a),Math.sqrt(1-a)))}r.on("geolocate",function(l){const o=l.coords.longitude,i=l.coords.latitude;if(t&&s(t.lat,t.lon,i,o){document.querySelector(".myButtonClass.highlighted-button")&&B(h,document.querySelector(".myButtonClass.highlighted-button"))})):T(c,i,A);const p=localStorage.getItem("markerColor")||"#ff6e42";v?v.setLngLat([i,c]):v=new maplibregl.Marker({color:p}).setLngLat([i,c]).addTo(e)}),K()})}function _(t){let n="background";for(var r=0;r${l.features[0].properties.etiqueta}
+ Carrer: ${l.features[0].properties.nom}
+ Municipi: ${l.features[0].properties.municipi}
+ Codi Postal: ${l.features[0].properties.codi_postal}
`).addTo(e)}),e.on("mouseleave","punts2",function(l){e.getCanvas().style.cursor="",s.remove()}))}function X(){document.getElementById("loader").style.display="block",document.getElementById("infoPanelContent").style.display="none"}function j(){document.getElementById("loader").style.display="none",document.getElementById("infoPanelContent").style.display="block"}function Y(){document.getElementById("mapLoader").style.display="flex"}function K(){document.getElementById("mapLoader").style.display="none"}class V{onAdd(n){return this._map=n,this._container=document.createElement("button"),this._container.className="maplibregl-ctrl pitch-control",this._container.textContent="3D",this._container.onclick=()=>{this._map.getPitch()===0?(this._map.easeTo({pitch:60}),this._container.textContent="2D"):(this._map.easeTo({pitch:0}),this._container.textContent="3D")},this._container}onRemove(){this._container.parentNode.removeChild(this._container),this._map=void 0}}function Q(){var t=document.getElementById("notification");t&&t.classList.remove("show");var n=document.getElementById("myModal"),r=document.getElementById("configListContainer");n.style.display="block",fetch("https://api.icgc.cat/territori/info").then(o=>o.json()).then(o=>{r.innerHTML="";const i=document.createElement("div"),c=document.createElement("input");c.type="checkbox",c.id="selectAllCheckbox";const p=document.createElement("label");i.id="selectDiv",p.id="selectLabel",p.htmlFor="selectAllCheckbox",p.textContent=" Seleccionar tots",i.appendChild(c),i.appendChild(p),r.appendChild(i),c.addEventListener("change",function(){r.querySelectorAll('input[type="checkbox"]:not(#selectAllCheckbox)').forEach(y=>{y.checked=c.checked})}),o.forEach(d=>{if(d.nomAPI!=="geocoder"&&d.nomAPI!=="elevacions"&&d.nomAPI!=="h3"&&d.nomAPI!=="precipitacio"&&d.nomAPI!=="temperatura"){const y=document.createElement("div");y.className="config-item";const a=document.createElement("input");a.type="checkbox",a.id=`${d.nomAPI}`,a.name=d.name,a.checked=!0;const f=document.createElement("label");f.htmlFor=`checkbox-${d.nomAPI}`,f.textContent=d.text,y.appendChild(a),y.appendChild(f),r.appendChild(y),a.addEventListener("change",function(){l()})}}),N(),l()}).catch(o=>console.error("Error fetching data:",o));var s=document.getElementsByClassName("close")[0];s.onclick=function(){z(),n.style.display="none"},window.onclick=function(o){o.target==n&&(z(),n.style.display="none")};function l(){const o=r.querySelectorAll('input[type="checkbox"]:not(#selectAllCheckbox)'),i=Array.from(o).every(c=>c.checked);selectAllCheckbox.checked=i}}function z(){const t=document.querySelectorAll('.config-item input[type="checkbox"]'),n=Array.from(t).map(r=>({id:r.id,checked:r.checked}));localStorage.setItem("layerConfig",JSON.stringify(n))}function N(){const t=JSON.parse(localStorage.getItem("layerConfig"));t&&(M=t,t.forEach(n=>{const r=document.getElementById(n.id);r&&(r.checked=n.checked)}))}function H(){var t=document.getElementById("infoPanel");t.classList.add("open"),t.style.width="300px",document.getElementById("openPanel").style.display="none"}function ee(){var t=document.getElementById("infoPanel");t.classList.remove("open"),t.style.width="0px",document.getElementById("openPanel").style.display="block"}function te(){J();const t=document.getElementById("textSelector");t.addEventListener("change",()=>{const r=t.value;U(r)}),document.getElementById("layerConfig").addEventListener("click",()=>{Q()})}window.addEventListener("DOMContentLoaded",te);document.getElementById("layerColor").addEventListener("input",t=>{const n=t.target.value;localStorage.setItem("clickedLayerColor",n),oe(n)});function oe(t){e.getLayer("clicked-layer")&&(e.setPaintProperty("clicked-layer","fill-color",t),e.setPaintProperty("clicked-layer","fill-outline-color",t))}document.getElementById("markerColor").addEventListener("input",t=>{const n=t.target.value;localStorage.setItem("markerColor",n),ne(n)});function ne(t){if(v){v.setPopup(null);const n=v.getLngLat();v.remove(),v=new maplibregl.Marker({color:t}).setLngLat(n).addTo(e)}}"serviceWorker"in navigator&&window.addEventListener("load",()=>{navigator.serviceWorker.register("/serviceworker.js").then(t=>{console.log("Service Worker registered with scope:",t.scope)},t=>{console.log("Service Worker registration failed:",t)})});window.closePanel=ee;window.openPanel=H;window.onBaseChange=G; diff --git a/dist/assets/index-oJ0Wf6Mg.js b/dist/assets/index-oJ0Wf6Mg.js deleted file mode 100644 index d6dc886..0000000 --- a/dist/assets/index-oJ0Wf6Mg.js +++ /dev/null @@ -1,4 +0,0 @@ -(function(){const o=document.createElement("link").relList;if(o&&o.supports&&o.supports("modulepreload"))return;for(const l of document.querySelectorAll('link[rel="modulepreload"]'))s(l);new MutationObserver(l=>{for(const n of l)if(n.type==="childList")for(const i of n.addedNodes)i.tagName==="LINK"&&i.rel==="modulepreload"&&s(i)}).observe(document,{childList:!0,subtree:!0});function r(l){const n={};return l.integrity&&(n.integrity=l.integrity),l.referrerPolicy&&(n.referrerPolicy=l.referrerPolicy),l.crossOrigin==="use-credentials"?n.credentials="include":l.crossOrigin==="anonymous"?n.credentials="omit":n.credentials="same-origin",n}function s(l){if(l.ep)return;l.ep=!0;const n=r(l);fetch(l.href,n)}})();var e,b;let A="",F=!0,h,g=null,B,S="#000000";const D={top:60,bottom:window.innerHeight*.5+25,left:60,right:60},R={top:100,bottom:100,left:300,right:50};async function G(){const o=document.getElementById("serveiSelector2").value;let r=null,s=null;if(e.getLayer("clicked-layer")){const n=e.getSource("clicked-layer");n&&n._data&&(r=n._data,e.getLayer("clicked-layer-labels")&&(s=n._data))}let l;o==="orto"?(l="https://geoserveis.icgc.cat/contextmaps/icgc_orto_estandard.json",S="#FFFFFF"):o==="topo"?(l="https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard_general.json",S="#000000"):o==="fosc"&&(l="https://geoserveis.icgc.cat/contextmaps/icgc_mapa_base_fosc.json",S="#FFFFFF"),e.setStyle(l),e.once("styledata",()=>{const n=_(e.getStyle().layers),i=localStorage.getItem("clickedLayerColor")||"#f9f91d";r&&(e.getSource("clicked-layer")||e.addSource("clicked-layer",{type:"geojson",data:r}),e.getLayer("clicked-layer")||e.addLayer({id:"clicked-layer",type:"fill",source:"clicked-layer",layout:{},paint:{"fill-color":i,"fill-outline-color":i,"fill-opacity":.5}},n),s&&(e.removeLayer("clicked-layer"),e.getLayer("clicked-layer-labels")||(e.addLayer({id:"clicked-layer",type:"circle",source:"clicked-layer",paint:{"circle-radius":8,"circle-color":i}}),e.addLayer({id:"clicked-layer-labels",type:"symbol",source:"clicked-layer",layout:{"text-field":["get","Codi_ICC"],"text-font":["Arial-Bold"],"text-size":12,"text-offset":[0,1.5],"text-anchor":"top"},paint:{"text-color":S}})))),o==="topo"?e.setSky({"sky-color":"#a5f0f0","sky-horizon-blend":.3,"horizon-color":"#e1e3e3","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#c5d6d6"}):o==="orto"?e.setSky({"sky-color":"#37709e","sky-horizon-blend":.3,"horizon-color":"#e1e3e3","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#c5d6d6"}):o==="fosc"&&e.setSky({"sky-color":"#232423","sky-horizon-blend":.3,"horizon-color":"#969996","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#383838"}),j().then(function(){q()})})}async function j(){e.getSource("terrainMapZen")||e.addSource("terrainMapZen",{type:"raster-dem",url:"https://s3.amazonaws.com/elevation-tiles-prod/terrarium/{z}/{x}/{y}.png",tileSize:512,maxzoom:14})}function q(){try{e.setTerrain({source:"terrainMapZen",exaggeration:1.5})}catch(t){console.log("ERROR addTerrain"),console.log(t)}}function P(){e.getLayer("clicked-layer")&&e.removeLayer("clicked-layer"),e.getLayer("clicked-layer-labels")&&e.removeLayer("clicked-layer-labels"),e.getSource("clicked-layer")&&e.removeSource("clicked-layer")}function W(t){const o=_(e.getStyle().layers);e.getLayer("hovered-layer")&&e.removeLayer("hovered-layer"),e.getSource("hovered-layer")&&e.removeSource("hovered-layer");for(let r=0;r${a.etiqueta} (distància: ${a.distancia} km)

`),p&&(s.innerHTML+=`Coordenades: ${t.toFixed(5)}, ${o.toFixed(5)}
`,s.innerHTML+=`Elevació: ${p} metres

`);for(let c=0;c{g=u,M(u,d)}),d.addEventListener("mouseover",()=>{W(u)}),d.addEventListener("mouseout",()=>{Z()}),s.appendChild(d),s.appendChild(document.createElement("br"))}i.length>0&&!g?setTimeout(()=>{g=i[0],M(g,s.querySelector(".myButtonClass"))},25):g&&document.querySelectorAll(".myButtonClass").forEach(u=>{u.textContent.includes(g)&&M(g,u)})}T()}function M(t,o){const r=_(e.getStyle().layers);P();const s=document.querySelector(".closeButtonClass");s&&s.parentNode.removeChild(s);let l=new maplibregl.LngLatBounds;for(let a=0;a{const C=L.geometry.coordinates;C&&C.length===2&&typeof C[0]=="number"&&typeof C[1]=="number"&&l.extend(C);const I=L.properties;I&&(m.forEach(x=>{if(I[x]!==void 0){const w=document.createElement("div");if(x==="Enllaç"){const E=document.createElement("a"),O=I[x];E.href=O,E.textContent="Fitxa ↓",E.target="_blank",E.classList.add("button-link"),w.appendChild(E)}else w.textContent=`${x}: ${I[x]}`;c.appendChild(w)}}),c.appendChild(document.createElement("br")))})}else{const f=h[a].geometry;if(f){e.addSource("clicked-layer",{type:"geojson",data:{type:"Feature",geometry:f,properties:{}}}),e.addLayer({id:"clicked-layer",type:"fill",source:"clicked-layer",layout:{},paint:{"fill-color":p,"fill-outline-color":p,"fill-opacity":.5}},r),f.type==="Polygon"?f.coordinates[0].forEach(y=>{y&&y.length===2&&typeof y[0]=="number"&&typeof y[1]=="number"&&l.extend(y)}):f.type==="MultiPolygon"&&f.coordinates.forEach(y=>{y[0].forEach(m=>{m&&m.length===2&&typeof m[0]=="number"&&typeof m[1]=="number"&&l.extend(m)})});const k=h[a].properties;if(k)for(const[y,m]of Object.entries(k)){const L=document.createElement("div");L.textContent=`${y}: ${m}`,c.appendChild(L)}}}document.querySelectorAll(".layer-properties").forEach(f=>f.remove());const d=document.createElement("button");d.textContent="×",d.classList.add("closeButtonClass"),d.addEventListener("click",()=>{P(),c.remove(),d.remove(),o.classList.remove("highlighted-button")}),c.appendChild(d),o&&(o.parentNode.insertBefore(c,o.nextSibling),o.parentNode.insertBefore(d,o.nextSibling)),document.querySelectorAll(".myButtonClass").forEach(f=>f.classList.remove("highlighted-button")),o.classList.add("highlighted-button")}const i=window.innerWidth<750?D:R;l.isEmpty()||e.fitBounds(l,{padding:i})}function J(){V(),e=new maplibregl.Map({container:"map",style:"https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard_general.json",center:[2.0042,41.7747],zoom:7,maxZoom:18,attributionControl:!1,hash:!1,maxPitch:85}),e.on("load",function(){j().then(function(){q()}),e.addControl(new maplibregl.NavigationControl,"top-right"),e.setSky({"sky-color":"#a5f0f0","sky-horizon-blend":.3,"horizon-color":"#e1e3e3","horizon-fog-blend":.9,"fog-ground-blend":.85,"fog-color":"#c5d6d6"});let t=null;const o=20,r=new maplibregl.GeolocateControl({positionOptions:{enableHighAccuracy:!0},trackUserLocation:!0});e.addControl(r,"top-right");function s(l,n,i,a){const c=(i-l)*Math.PI/180,u=(a-n)*Math.PI/180,d=Math.sin(c/2)*Math.sin(c/2)+Math.cos(l*Math.PI/180)*Math.cos(i*Math.PI/180)*Math.sin(u/2)*Math.sin(u/2);return 6371e3*(2*Math.atan2(Math.sqrt(d),Math.sqrt(1-d)))}r.on("geolocate",function(l){const n=l.coords.longitude,i=l.coords.latitude;if(t&&s(t.lat,t.lon,i,n){document.querySelector(".myButtonClass.highlighted-button")&&M(g,document.querySelector(".myButtonClass.highlighted-button"))})):z(a,i,A);const p=localStorage.getItem("markerColor")||"#ff6e42";b?b.setLngLat([i,a]):b=new maplibregl.Marker({color:p}).setLngLat([i,a]).addTo(e)}),Q()})}function _(t){let o="background";for(var r=0;r${l.features[0].properties.etiqueta}
- Carrer: ${l.features[0].properties.nom}
- Municipi: ${l.features[0].properties.municipi}
- Codi Postal: ${l.features[0].properties.codi_postal}
`).addTo(e)}),e.on("mouseleave","punts2",function(l){e.getCanvas().style.cursor="",s.remove()}))}function K(){document.getElementById("loader").style.display="block",document.getElementById("infoPanelContent").style.display="none"}function T(){document.getElementById("loader").style.display="none",document.getElementById("infoPanelContent").style.display="block"}function V(){document.getElementById("mapLoader").style.display="flex"}function Q(){document.getElementById("mapLoader").style.display="none"}class X{onAdd(o){return this._map=o,this._container=document.createElement("button"),this._container.className="maplibregl-ctrl pitch-control",this._container.textContent="3D",this._container.onclick=()=>{this._map.getPitch()===0?(this._map.easeTo({pitch:60}),this._container.textContent="2D"):(this._map.easeTo({pitch:0}),this._container.textContent="3D")},this._container}onRemove(){this._container.parentNode.removeChild(this._container),this._map=void 0}}function Y(){var t=document.getElementById("notification");t&&t.classList.remove("show");var o=document.getElementById("myModal"),r=document.getElementById("configListContainer");o.style.display="block",fetch("https://api.icgc.cat/territori/info").then(n=>n.json()).then(n=>{r.innerHTML="";const i=document.createElement("div"),a=document.createElement("input");a.type="checkbox",a.id="selectAllCheckbox";const p=document.createElement("label");i.id="selectDiv",p.id="selectLabel",p.htmlFor="selectAllCheckbox",p.textContent=" Seleccionar tots",i.appendChild(a),i.appendChild(p),r.appendChild(i),a.addEventListener("change",function(){r.querySelectorAll('input[type="checkbox"]:not(#selectAllCheckbox)').forEach(u=>{u.checked=a.checked})}),n.forEach(c=>{if(c.nomAPI!=="geocoder"&&c.nomAPI!=="elevacions"&&c.nomAPI!=="h3"){const u=document.createElement("div");u.className="config-item";const d=document.createElement("input");d.type="checkbox",d.id=`${c.nomAPI}`,d.name=c.name,d.checked=!0;const v=document.createElement("label");v.htmlFor=`checkbox-${c.nomAPI}`,v.textContent=c.text,u.appendChild(d),u.appendChild(v),r.appendChild(u),d.addEventListener("change",function(){l()})}}),N(),l()}).catch(n=>console.error("Error fetching data:",n));var s=document.getElementsByClassName("close")[0];s.onclick=function(){$(),o.style.display="none"},window.onclick=function(n){n.target==o&&($(),o.style.display="none")};function l(){const n=r.querySelectorAll('input[type="checkbox"]:not(#selectAllCheckbox)'),i=Array.from(n).every(a=>a.checked);selectAllCheckbox.checked=i}}function $(){const t=document.querySelectorAll('.config-item input[type="checkbox"]'),o=Array.from(t).map(r=>({id:r.id,checked:r.checked}));localStorage.setItem("layerConfig",JSON.stringify(o))}function N(){const t=JSON.parse(localStorage.getItem("layerConfig"));t&&(B=t,t.forEach(o=>{const r=document.getElementById(o.id);r&&(r.checked=o.checked)}))}function H(){var t=document.getElementById("infoPanel");t.classList.add("open"),t.style.width="300px",document.getElementById("openPanel").style.display="none"}function ee(){var t=document.getElementById("infoPanel");t.classList.remove("open"),t.style.width="0px",document.getElementById("openPanel").style.display="block"}function te(){J();const t=document.getElementById("textSelector");t.addEventListener("change",()=>{const r=t.value;U(r)}),document.getElementById("layerConfig").addEventListener("click",()=>{Y()})}window.addEventListener("DOMContentLoaded",te);document.getElementById("layerColor").addEventListener("input",t=>{const o=t.target.value;localStorage.setItem("clickedLayerColor",o),oe(o)});function oe(t){e.getLayer("clicked-layer")&&(e.setPaintProperty("clicked-layer","fill-color",t),e.setPaintProperty("clicked-layer","fill-outline-color",t))}document.getElementById("markerColor").addEventListener("input",t=>{const o=t.target.value;localStorage.setItem("markerColor",o),ne(o)});function ne(t){if(b){b.setPopup(null);const o=b.getLngLat();b.remove(),b=new maplibregl.Marker({color:t}).setLngLat(o).addTo(e)}}"serviceWorker"in navigator&&window.addEventListener("load",()=>{navigator.serviceWorker.register("/serviceworker.js").then(t=>{console.log("Service Worker registered with scope:",t.scope)},t=>{console.log("Service Worker registration failed:",t)})});window.closePanel=ee;window.openPanel=H;window.onBaseChange=G; diff --git a/dist/index.html b/dist/index.html index de0eb9a..b33102e 100644 --- a/dist/index.html +++ b/dist/index.html @@ -695,7 +695,7 @@ } - + diff --git a/src/main.js b/src/main.js index 9a84da1..e4d5fd2 100644 --- a/src/main.js +++ b/src/main.js @@ -277,25 +277,27 @@ async function apiConnect(lat, lon, service) { } else if (dades.responses.features[i].id === 'Elevació') { elevation = dades.responses.features[i].properties.value; } - else if (dades.responses.features[i].id === 'Temperatura mitjana anual') { - console.log('catch temp') - temp = dades.responses.features[i].properties.GRAY_INDEX; - } - else if (dades.responses.features[i].id === 'Precipitació mitjana anual') { - ppt = dades.responses.features[i].properties.GRAY_INDEX; - } + /* else if (dades.responses.features[i].id === 'Temperatura mitjana anual') { + console.log('catch temp') + temp = dades.responses.features[i].properties.GRAY_INDEX; + } + else if (dades.responses.features[i].id === 'Precipitació mitjana anual') { + ppt = dades.responses.features[i].properties.GRAY_INDEX; + } */ } if (address) { contentHtml.innerHTML += `

${address.etiqueta} (distància: ${address.distancia} km)

`; } - if (elevation && temp && ppt) { + if (elevation) { contentHtml.innerHTML += `Coordenades: ${lat.toFixed(5)}, ${lon.toFixed(5)}
` - contentHtml.innerHTML += `Elevació: ${elevation} metres
` - contentHtml.innerHTML += `Temperatura mijana anual: ${temp.toFixed(2)} ºC
` - contentHtml.innerHTML += `Precipitació mijana anual: ${ppt.toFixed(2)} mm

` + contentHtml.innerHTML += `Elevació: ${elevation} metres

` } + /* if (temp || ppt) { + contentHtml.innerHTML += `Temperatura mijana anual: ${temp.toFixed(2)} ºC
` + contentHtml.innerHTML += `Precipitació mijana anual: ${ppt.toFixed(2)} mm

` + } */ for (let j = 0; j < serveisDisponibles.length; j++) { - if (serveisDisponibles[j] !== 'Geocodificador' && serveisDisponibles[j] !== 'Elevació' && serveisDisponibles[j] !== 'H3 geospatial indexing system' && serveisDisponibles[j] !== 'Temperatura mitjana anual' && serveisDisponibles[j] !== 'Precipitació mitjana anual') { + if (serveisDisponibles[j] !== 'Geocodificador' && serveisDisponibles[j] !== 'Elevació' && serveisDisponibles[j] !== 'H3 geospatial indexing system') { const servei = serveisDisponibles[j]; const button = document.createElement('button'); button.textContent = servei; @@ -814,7 +816,7 @@ function mapSettings() { // Afegir els altres checkboxes data.forEach(item => { - if (item.nomAPI !== 'geocoder' && item.nomAPI !== 'elevacions' && item.nomAPI !== 'h3' && item.nomAPI !== 'precipitacio' && item.nomAPI !== 'temperatura') { + if (item.nomAPI !== 'geocoder' && item.nomAPI !== 'elevacions' && item.nomAPI !== 'h3') { const listItem = document.createElement('div'); listItem.className = 'config-item'; const checkbox = document.createElement('input');