From 60519b8c61e12336f7e970752a289ba9cbfdbeb7 Mon Sep 17 00:00:00 2001 From: lstiz Date: Tue, 15 Oct 2024 08:55:02 +0200 Subject: [PATCH] Deployed 2a32d59 with MkDocs version: 1.5.3 --- 1.2.Inst_cdn/index.html | 8 +++--- 2.1.0.Map/index.html | 4 +-- 2.1.2.AddICGCTerrain/index.html | 4 +-- 2.1.3.3dStyle/index.html | 4 +-- 2.10.AddLogo/index.html | 6 ++-- 2.11.FetchData/index.html | 4 +-- 2.12.FetchDataAndMenu/index.html | 4 +-- 2.13.AddFeatureQuery/index.html | 6 ++-- 2.14.AddGeocoderICGC/index.html | 4 +-- 2.2.AddBasemap/index.html | 4 +-- 2.20.AdvancedExample/index.html | 6 ++-- 2.21.Maplibre2Mapicgc/index.html | 4 +-- 2.3.AddImageLayerICGC/index.html | 4 +-- 2.4.AddVectorLayerICGC/index.html | 4 +-- 2.5.AddLayerGeojson/index.html | 4 +-- 2.6.AddLayerTree/index.html | 4 +-- 2.7.AddMarker/index.html | 4 +-- 2.8.AddControl/index.html | 4 +-- 2.9.AddCompare/index.html | 4 +-- index.html | 2 +- search/search_index.json | 2 +- sitemap.xml | 46 +++++++++++++++--------------- sitemap.xml.gz | Bin 459 -> 460 bytes test/index 1 (1).html | 4 +-- 24 files changed, 70 insertions(+), 70 deletions(-) diff --git a/1.2.Inst_cdn/index.html b/1.2.Inst_cdn/index.html index fcc6efa..61a8429 100755 --- a/1.2.Inst_cdn/index.html +++ b/1.2.Inst_cdn/index.html @@ -1141,9 +1141,9 @@

Instal·lació amb CDN

Si prefereixes utilitzar un CDN per incorporar la biblioteca al teu projecte, pots seguir aquests passos:

1.Obre la teva terminal i navega fins al directori del teu projecte.

2.Afegir la línia següent al teu fitxer HTML, generalment col·locada dins la secció <head>:

-
<script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+
<script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
 
-<link href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css" rel="stylesheet" />
+<link href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css" rel="stylesheet" />
 

 
Això carregarà la biblioteca directament des del CDN.
 Ara estàs llest per utilitzar mapicgc-gl-js al teu projecte seguint l'exemple següent:

@@ -1152,8 +1152,8 @@ 
Instal·lació amb CDN

     <meta charset="utf-8" />
     <title>Exemple biblioteca mapicgc-gl-js</title>
     <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
-    <link href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css" rel="stylesheet"/>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <link href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css" rel="stylesheet"/>
 
     <style>
       body {
diff --git a/2.1.0.Map/index.html b/2.1.0.Map/index.html
index 154f657..192a3a4 100755
--- a/2.1.0.Map/index.html
+++ b/2.1.0.Map/index.html
@@ -1246,9 +1246,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.1.2.AddICGCTerrain/index.html b/2.1.2.AddICGCTerrain/index.html
index f00adf0..344d6c4 100755
--- a/2.1.2.AddICGCTerrain/index.html
+++ b/2.1.2.AddICGCTerrain/index.html
@@ -1244,9 +1244,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.1.3.3dStyle/index.html b/2.1.3.3dStyle/index.html
index 0f945c3..5490702 100755
--- a/2.1.3.3dStyle/index.html
+++ b/2.1.3.3dStyle/index.html
@@ -1246,9 +1246,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.10.AddLogo/index.html b/2.10.AddLogo/index.html
index 41a60b9..c575c02 100755
--- a/2.10.AddLogo/index.html
+++ b/2.10.AddLogo/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
@@ -1240,7 +1240,7 @@ 
Codi

         });
         let options = {
           id: "icgcColorLogo",
-          url: "https://tilemaps.icgc.cat/cdn/images/grumpyCatTest.png",
+          url: "https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/images/grumpyCatTest.png",
           href: "https://www.icgc.cat",
           height: "100px",
         };
diff --git a/2.11.FetchData/index.html b/2.11.FetchData/index.html
index bd8dcd6..c678f01 100755
--- a/2.11.FetchData/index.html
+++ b/2.11.FetchData/index.html
@@ -1263,9 +1263,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.12.FetchDataAndMenu/index.html b/2.12.FetchDataAndMenu/index.html
index 13a6bbb..32ebfd7 100755
--- a/2.12.FetchDataAndMenu/index.html
+++ b/2.12.FetchDataAndMenu/index.html
@@ -1263,9 +1263,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.13.AddFeatureQuery/index.html b/2.13.AddFeatureQuery/index.html
index 1080274..877abfc 100755
--- a/2.13.AddFeatureQuery/index.html
+++ b/2.13.AddFeatureQuery/index.html
@@ -1197,9 +1197,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
@@ -1249,7 +1249,7 @@ 
Codi

 
           let popupStyle = {
             title: "Informació:",
-            image: "https://tilemaps.icgc.cat/cdn/logos/icgc_logo_color.png",
+            image: "https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/logos/icgc_logo_color.png",
           };
           // si volem camps específics:
           // let queryFields = ["nom", "municipi"];
diff --git a/2.14.AddGeocoderICGC/index.html b/2.14.AddGeocoderICGC/index.html
index 981bcb4..80a3aff 100755
--- a/2.14.AddGeocoderICGC/index.html
+++ b/2.14.AddGeocoderICGC/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.2.AddBasemap/index.html b/2.2.AddBasemap/index.html
index eb196b0..697e905 100755
--- a/2.2.AddBasemap/index.html
+++ b/2.2.AddBasemap/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.20.AdvancedExample/index.html b/2.20.AdvancedExample/index.html
index 7342a7a..c8faedd 100755
--- a/2.20.AdvancedExample/index.html
+++ b/2.20.AdvancedExample/index.html
@@ -1195,9 +1195,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
@@ -1324,7 +1324,7 @@ 
Codi

 
           let popupStyle = {
             title: "Informació:",
-            image: "https://tilemaps.icgc.cat/cdn/logos/gencat_logo_color.png",
+            image: "https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/logos/gencat_logo_color.png",
           };
           let queryFields = ["nom", "municipi"]; // [] for query all the properties
           map.addFeatureQuery("RutesMontserrat", queryFields, popupStyle);
diff --git a/2.21.Maplibre2Mapicgc/index.html b/2.21.Maplibre2Mapicgc/index.html
index 16446b0..967b511 100755
--- a/2.21.Maplibre2Mapicgc/index.html
+++ b/2.21.Maplibre2Mapicgc/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.3.AddImageLayerICGC/index.html b/2.3.AddImageLayerICGC/index.html
index 5ea8aa3..530bf72 100755
--- a/2.3.AddImageLayerICGC/index.html
+++ b/2.3.AddImageLayerICGC/index.html
@@ -1280,9 +1280,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.4.AddVectorLayerICGC/index.html b/2.4.AddVectorLayerICGC/index.html
index d927c75..e7ad9ec 100755
--- a/2.4.AddVectorLayerICGC/index.html
+++ b/2.4.AddVectorLayerICGC/index.html
@@ -1280,9 +1280,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.5.AddLayerGeojson/index.html b/2.5.AddLayerGeojson/index.html
index 2af084b..d9a5960 100755
--- a/2.5.AddLayerGeojson/index.html
+++ b/2.5.AddLayerGeojson/index.html
@@ -1214,9 +1214,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.6.AddLayerTree/index.html b/2.6.AddLayerTree/index.html
index c8034e9..95103a8 100755
--- a/2.6.AddLayerTree/index.html
+++ b/2.6.AddLayerTree/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.7.AddMarker/index.html b/2.7.AddMarker/index.html
index b1966c8..29dbe7f 100755
--- a/2.7.AddMarker/index.html
+++ b/2.7.AddMarker/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.8.AddControl/index.html b/2.8.AddControl/index.html
index 6543361..3e06475 100755
--- a/2.8.AddControl/index.html
+++ b/2.8.AddControl/index.html
@@ -1334,9 +1334,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/2.9.AddCompare/index.html b/2.9.AddCompare/index.html
index 9603862..2ebed93 100755
--- a/2.9.AddCompare/index.html
+++ b/2.9.AddCompare/index.html
@@ -1196,9 +1196,9 @@ 
Codi

       name="viewport"
       content="initial-scale=1,maximum-scale=1,user-scalable=no"
     />
-    <script src="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js"></script>
+    <script src="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js"></script>
     <link
-      href="https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css"
+      href="https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css"
       rel="stylesheet"
     />
 
diff --git a/index.html b/index.html
index a68f418..2fe0f18 100755
--- a/index.html
+++ b/index.html
@@ -1331,7 +1331,7 @@ 
Versionat

 
 
Autor i contacte

 
Unitat Geostart, Institut Cartogràfic i Geològic de Catalunya.

-

+

 
 
 
diff --git a/search/search_index.json b/search/search_index.json
index eb058e5..b2349c4 100755
--- a/search/search_index.json
+++ b/search/search_index.json
@@ -1 +1 @@
-{"config":{"lang":["en"],"separator":"[\\s\\-]+","pipeline":["stopWordFilter"]},"docs":[{"location":"","title":"MapICGC-gl-js","text":"
La biblioteca MapICGC GL JS, creada com a envoltori de MapLibreGL, ofereix noves funcions espec\u00edfiques en un entorn ICGC. Simplifica el desenvolupament integrant caracter\u00edstiques com tessel\u00b7les vectorials i imatges satel\u00b7litals, i incorpora de manera inmediata estils, terrenys i dades ICGC.  Proporciona funcions documentades per a la creaci\u00f3 d'un visor complet i totalment personalitzable.
"},{"location":"#que-es","title":"Qu\u00e8 \u00e9s?","text":"
La biblioteca MapICGC GL JS, basada en Maplibre GL, \u00e9s una eina desenvolupada per l'Institut Cartogr\u00e0fic i Geol\u00f2gic de Catalunya (ICGC) per millorar la cartografia web i proporcionar una soluci\u00f3 integrada als desenvolupadors. Permet accedir f\u00e0cilment a dades geoespacials de l'ICGC, com ara tessel\u00b7les vectorials, imatges satel\u00b7litals i models d'elevaci\u00f3 del terreny, facilitant la creaci\u00f3 de visors web personalitzats. A m\u00e9s, ofereix funcions per a la gesti\u00f3 de dades en temps d'execuci\u00f3, com geocodificaci\u00f3 i geolocalitzaci\u00f3, i el seu disseny modular permet la seva aplicaci\u00f3 en una \u00e0mplia gamma de projectes de cartografia i gesti\u00f3 de recursos.
"},{"location":"#com-funciona","title":"Com funciona?","text":"
La biblioteca MapICGC GL JS funciona integrant funcionalitats de Maplibre GL i proporcionant acc\u00e9s a dades geoespacials de l'Institut Cartogr\u00e0fic i Geol\u00f2gic de Catalunya (ICGC). Per integrar-ho al teu projecte, nom\u00e8s cal instal\u00b7lar la biblioteca mitjan\u00e7ant NPM o integrar-la a trav\u00e9s de CDN. Gran part del codi Maplibre/Mapbox es compatible amb la biblioteca MapICGC GL JS.
"},{"location":"#installacio","title":"Instal\u00b7laci\u00f3","text":"
     
  • 1.1 Instal\u00b7laci\u00f3 via NPM
    •  
  • 1.2 Instal\u00b7laci\u00f3 via CDN
    •  
"},{"location":"#exemples","title":"Exemples","text":"
     
  • 2.1 Crear mapa i afegir estil
    •  
  • 2.2 Afegir terreny
    •  
  • 2.3 Afegir estil ORTO3D
    •  
  • 2.4 Afegir control d'estil
    •  
  • 2.5 Afegir capa d'imatge ICGC
    •  
  • 2.6 Afegir capa vector ICGC
    •  
  • 2.7 Afegir capa GeoJSON
    •  
  • 2.8 Afegir llistat de capes
    •  
  • 2.9 Afegir marcador
    •  
  • 2.10 Afegir control
    •  
  • 2.11 Afegir comparador
    •  
  • 2.12 Afegir logo
    •  
  • 2.13 Fetch dades
    •  
  • 2.14 Fetch dades i crea men\u00fa
    •  
  • 2.15 Consulta d'elements
    •  
  • 2.16 Afegir geocodificador ICGC
    •  
  • 2.17 Exemple visor
    •  
  • 2.18 Reutilitzaci\u00f3 codi Maplibre
    •  
"},{"location":"#documentacio","title":"Documentaci\u00f3","text":"
     
  • 3.1 Funcions
    •  
"},{"location":"#templates","title":"Templates","text":"
     
  • Svelte
    •  
  • React
    •  
  • Vanilla JS
    •  
"},{"location":"#llicencia","title":"Llic\u00e8ncia","text":"
     
  • BSD-3-Clause license
    •  
"},{"location":"#versionat","title":"Versionat","text":"
     
  • Versi\u00f3 1.0.0
    •  
"},{"location":"#autor-i-contacte","title":"Autor i contacte","text":"
Unitat Geostart, Institut Cartogr\u00e0fic i Geol\u00f2gic de Catalunya.
 
"},{"location":"1.1.Inst_npm/","title":"1.1 Instal\u00b7laci\u00f3 via NPM","text":""},{"location":"1.1.Inst_npm/#installacio-amb-npm","title":"Instal\u00b7laci\u00f3 amb NPM","text":"
Si utilitzes npm (Node Package Manager) per gestionar les depend\u00e8ncies del teu projecte, segueix aquests passos:
 
1.Obre la teva terminal i navega fins al directori del teu projecte.
 
2.Executa la seg\u00fcent comanda per instal\u00b7lar mapicgc-gl-js:
 
npm install mapicgc-gl-js\n
 
Aix\u00f2 descarregar\u00e0 i instal\u00b7lar\u00e0 la biblioteca al teu projecte.
 
3.Un cop completada la instal\u00b7laci\u00f3, pots importar la biblioteca al teu codi:
 
 const biblioteca = require('mapicgc-gl-js'); //ES6\n
 
o
 
 import { Map, Config } from \"mapicgc-gl-js\";\n
 
Ara est\u00e0s llest per comen\u00e7ar a utilitzar mapicgc-gl-js, seguint l'exemple seg\u00fcent:
 
<script>\n  import { Map, Config } from \"mapicgc-gl-js\";\n  import \"../node_modules/mapicgc-gl-js/dist/mapicgc-gl.css\";\n\n  async function initMap() {\n    const data = await Config.getConfigICGC();\n    const map = new Map({\n      container: \"map\",\n      style: data.Styles.TOPO,\n      center: [2.1464, 41.306],\n      zoom: 7.4,\n      maxZoom: 14,\n      hash: true,\n      pitch: 0,\n    });\n  }\n  initMap();\n</script> \n
"},{"location":"1.2.Inst_cdn/","title":"1.2 Instal\u00b7laci\u00f3 via CDN","text":""},{"location":"1.2.Inst_cdn/#installacio-amb-cdn","title":"Instal\u00b7laci\u00f3 amb CDN","text":"
Si prefereixes utilitzar un CDN per incorporar la biblioteca al teu projecte, pots seguir aquests passos:
 
1.Obre la teva terminal i navega fins al directori del teu projecte.
 
2.Afegir la l\u00ednia seg\u00fcent al teu fitxer HTML, generalment col\u00b7locada dins la secci\u00f3 <head>:
 
<script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n\n<link href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\" rel=\"stylesheet\" />\n
 
Aix\u00f2 carregar\u00e0 la biblioteca directament des del CDN. Ara est\u00e0s llest per utilitzar mapicgc-gl-js al teu projecte seguint l'exemple seg\u00fcent:
 
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple biblioteca mapicgc-gl-js</title>\n    <meta name=\"viewport\" content=\"initial-scale=1,maximum-scale=1,user-scalable=no\" />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\" rel=\"stylesheet\"/>\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
 
 See the Pen    example-map-001 by unitatgeostart (@unitatgeostart)   on CodePen. 
"},{"location":"2.1.0.Map/","title":"2.1 Crear mapa i afegir estil","text":""},{"location":"2.1.0.Map/#exemple","title":"Exemple","text":"
.Map(options) \u2192 mateixes opcions que a MapLibreGLJS
 
 See the Pen    example Map by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.1.0.Map/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Mapa</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 14,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.1.0.Map/#estils-icgc","title":"Estils ICGC","text":""},{"location":"2.1.0.Map/#stylesid","title":"Styles.{id}","text":"id Mostra TOPO ORTO ORTO3D (versi\u00f3 experimental) ORTOHYBRID ADMIN DARK LIGHT GEOLOGY"},{"location":"2.1.2.AddICGCTerrain/","title":"2.2 Afegir terreny","text":""},{"location":"2.1.2.AddICGCTerrain/#exemple","title":"Exemple","text":"
.addTerrainICGC(resolution, position)
 
 See the Pen    addTerrainICGC by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.1.2.AddICGCTerrain/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir 3D de l'ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.ORTO,\n          center: [0.959, 42.201],\n          zoom: 13,\n          maxZoom: 14,\n          hash: true,\n          pitch: 80,\n          bearing: 40,\n        });\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n          map.addTerrainICGC(data.Terrains.ICGC5M, \"bottom-right\");\n          map.setSky()\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.1.2.AddICGCTerrain/#terrenys-icgc","title":"Terrenys ICGC","text":""},{"location":"2.1.2.AddICGCTerrain/#terrainsid","title":"Terrains.{id}","text":"id Resoluci\u00f3 / Extensi\u00f3 ICGC5M 5m / Catalunya WORLD30M 30m / World"},{"location":"2.1.3.3dStyle/","title":"2.3 Afegir estil ORTO3D","text":""},{"location":"2.1.3.3dStyle/#exemple","title":"Exemple","text":"
.Map({style: mapicgcgl.Styles.ORTO3D})
 
 See the Pen    example Map 3D by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.1.3.3dStyle/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: estil ORTO3D</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.ORTO3D,\n          center: [2.309, 41.98],\n          zoom: 18,\n          maxZoom: 19,\n          hash: true,\n          bearing: 45,\n        });\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.1.3.3dStyle/#estils-icgc","title":"Estils ICGC","text":""},{"location":"2.1.3.3dStyle/#stylesid","title":"Styles.{id}","text":"id Mostra TOPO ORTO ORTO3D (versi\u00f3 experimental) ORTOHYBRID ADMIN DARK LIGHT GEOLOGY"},{"location":"2.10.AddLogo/","title":"2.12 Afegir logo","text":""},{"location":"2.10.AddLogo/#exemple","title":"Exemple","text":"
.addLogo(options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.10.AddLogo/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir logo</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      #logos {\n        display: flex;\n        flex-direction: row;\n        bottom: 40%;\n        position: absolute;\n        right: 50%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        let options = {\n          id: \"icgcColorLogo\",\n          url: \"https://tilemaps.icgc.cat/cdn/images/grumpyCatTest.png\",\n          href: \"https://www.icgc.cat\",\n          height: \"100px\",\n        };\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n          map.addLogo(options); //pots canviar la posici\u00f3 del/s logo/s al css\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.11.FetchData/","title":"2.13 Fetch dades","text":""},{"location":"2.11.FetchData/#exemple","title":"Exemple","text":"
.fetchData(url,idLayer,options)
 
\ud83d\udccc Format de dades: geojson o flatgeobuf
 
 See the Pen    Exemple fetchData by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.11.FetchData/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Fetch dades</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.LIGHT,\n          center: [1.808, 41.618],\n          zoom: 10,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        let paintOptions = {\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"green\",\n            \"line-width\": 3,\n            \"line-opacity\": 1,\n          },\n          layerPosition: \"top\", // select: 'top', 'lines' or 'labels'\n        };\n        let paintOptionsfgb = {\n          type: \"line\",\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"grey\",\n            \"line-width\": 2,\n          },\n          layerPosition: \"top\", // select: 'top', 'lines' or 'labels'\n        };\n\n        map.on(\"load\", () => {\n          map.fetchData(\n            data.Layers.FGBAdmin.comarquesVigent,\n            \"Comarques\",\n            paintOptionsfgb\n          );\n\n          map.fetchData(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            paintOptions\n          );\n          // try with FGB data:\n\n          // map.fetchData(\n          //     \"https://flatgeobuf.org/test/data/UScounties.fgb\",\n          //     \"UScounties\", paintOptionsfgb\n          // );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.11.FetchData/#posicio-layerposition","title":"Posici\u00f3 (layerPosition)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.11.FetchData/#capes-fgb-icgc","title":"Capes FGB ICGC","text":""},{"location":"2.11.FetchData/#layersfgbadminid","title":"Layers.FGBAdmin.{id}","text":"id agrupacionsCensalsVigent agrupacionsCensalsVigentText areesBasiquesPolicialsVigent areesBasiquesPolicialsVigentText areesBasiquesServeisSocialsVigent areesBasiquesServeisSocialsVigentText areesGestioAssistencialVigent areesHidrogeologiquesAquifersVigent catalunyaVigent catalunyaVigentText comarquesVigent comarquesVigentText districtesCensalsVigent districtesCensalsVigentText incendisForestalsVigent incendisForestalsVigentText municipisVigent municipisVigentText partitsJudicialsVigent partitsJudicialsVigentText plaTerritorialVigent plaTerritorialVigentText provinciesVigent provinciesVigentText regionsPolicialsVigent regionsPolicialsVigentText regionsSanitariesVigent regionsSanitariesVigentText seccionsCensalsVigent seccionsCensalsVigentText sectorsSanitarisVigent vegueriesVigent vegueriesVigentText"},{"location":"2.12.FetchDataAndMenu/","title":"2.14 Fetch dades i crea men\u00fa","text":""},{"location":"2.12.FetchDataAndMenu/#exemple","title":"Exemple","text":"
.fetchDataAndMenu(url,idLayer,filterField,options)
 
\ud83d\udccc Format de dades: geojson o flatgeobuf
 
 See the Pen    Exemple fetchData by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.12.FetchDataAndMenu/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Fetch dades</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n\n      /* Personalitza el teu men\u00fa: */\n\n      #menu-group {\n        position: absolute;\n        top: 10px;\n        left: 10px;\n        color: #000000;\n      }\n\n      #menu-group input[type=\"checkbox\"] + label {\n        background-color: #ffffff !important;\n      }\n\n      #titleDivMenu {\n        background-color: rgb(213 212 212);\n      }\n\n      #titleDivMenuSub {\n        background-color: #e9e9e9;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [1.808, 41.618],\n          zoom: 10,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        let filterField = \"municipi\"; // select 'all' for view all the features as a single layer\n        let optionsLayer = {\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"green\",\n            \"line-width\": 3,\n            \"line-opacity\": 1,\n          },\n          layerPosition: \"labels\",\n        };\n\n        let filterFGBField = \"NOMPROV\"; // select 'all' for view all the features as a single layer\n        let optionsLayerfgb = {\n          type: \"line\",\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"grey\",\n            \"line-opacity\": 1,\n            \"line-width\": 2,\n          },\n          layerPosition: \"labels\",\n        };\n\n        map.on(\"load\", () => {\n          map.fetchDataAndMenu(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            filterField,\n            optionsLayer\n          );\n\n          //     map.fetchDataAndMenu(\n          //     \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n          //     \"RutesMontserrat\", filterField, layerPosition, paintOptions);\n\n          // map.fetchDataAndMenu(\n          //     data.Layers.FGBAdmin.provinciesVigent, \"Provincies\",\n          //     filterFGBField, layerPosition, paintOptionsfgb\n          // );\n          map.fetchDataAndMenu(\n            data.Layers.FGBAdmin.provinciesVigent,\n            \"Provincies\",\n            filterFGBField,\n            optionsLayerfgb\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.12.FetchDataAndMenu/#posicio-layerposition","title":"Posici\u00f3 (layerPosition)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.12.FetchDataAndMenu/#capes-fgb-icgc","title":"Capes FGB ICGC","text":""},{"location":"2.12.FetchDataAndMenu/#layersfgbadminid","title":"Layers.FGBAdmin.{id}","text":"id agrupacionsCensalsVigent agrupacionsCensalsVigentText areesBasiquesPolicialsVigent areesBasiquesPolicialsVigentText areesBasiquesServeisSocialsVigent areesBasiquesServeisSocialsVigentText areesGestioAssistencialVigent areesHidrogeologiquesAquifersVigent catalunyaVigent catalunyaVigentText comarquesVigent comarquesVigentText districtesCensalsVigent districtesCensalsVigentText incendisForestalsVigent incendisForestalsVigentText municipisVigent municipisVigentText partitsJudicialsVigent partitsJudicialsVigentText plaTerritorialVigent plaTerritorialVigentText provinciesVigent provinciesVigentText regionsPolicialsVigent regionsPolicialsVigentText regionsSanitariesVigent regionsSanitariesVigentText seccionsCensalsVigent seccionsCensalsVigentText sectorsSanitarisVigent vegueriesVigent vegueriesVigentText"},{"location":"2.13.AddFeatureQuery/","title":"2.15 Consulta d'elements","text":""},{"location":"2.13.AddFeatureQuery/#exemple","title":"Exemple","text":"
.addFeatureQuery(layer, queryFields, popupStyle)
 
Retorna informaci\u00f3 al fer clic sobre un element
 
 See the Pen    Exemple Consulta d'elements by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.13.AddFeatureQuery/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Consulta d'elements</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          let paintOptions = {\n            layout: { visibility: \"visible\" },\n            paint: {\n              \"line-color\": \"red\",\n              \"line-width\": 2,\n              \"line-opacity\": 1,\n            },\n            layerPosition: \"top\",\n          };\n\n          map.fetchData(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            paintOptions\n          );\n\n          let popupStyle = {\n            title: \"Informaci\u00f3:\",\n            image: \"https://tilemaps.icgc.cat/cdn/logos/icgc_logo_color.png\",\n          };\n          // si volem camps espec\u00edfics:\n          // let queryFields = [\"nom\", \"municipi\"];\n          let queryFields = [];\n          map.addFeatureQuery(\"RutesMontserrat\", queryFields, popupStyle);\n\n          //si volem tots els par\u00e0metres:\n          // map.addFeatureQuery(\"RutesMontserrat\");\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.14.AddGeocoderICGC/","title":"2.16 Afegir geocodificador ICGC","text":""},{"location":"2.14.AddGeocoderICGC/#exemple","title":"Exemple","text":"
.addGeocoderICGC()
 
 See the Pen    Exemple geocodificador by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.14.AddGeocoderICGC/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Geocodificador</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [1.8436, 41.5923],\n          zoom: 11,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          map.addGeocoderICGC();\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.2.AddBasemap/","title":"2.4 Afegir control d'estil","text":""},{"location":"2.2.AddBasemap/#exemple","title":"Exemple","text":"
.addBasemapsICGC(baseLayers)
 
 See the Pen    addBasemapsICGC by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.2.AddBasemap/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir mapa base ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n\n      #basemap-group {\n        position: absolute;\n        bottom: 40px;\n        right: 10px;\n        color: #000000;\n        display: flex;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO, // <-- add style basemap here\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 14,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          //add multiple ICGC basemaps and get a style menu component\n          map.addFullscreenControl();\n          let basemapsicgc = [data.Styles.ORTO, data.Styles.TOPO];\n          map.addBasemapsICGC(basemapsicgc);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.20.AdvancedExample/","title":"2.17 Exemple visor","text":""},{"location":"2.20.AdvancedExample/#exemple","title":"Exemple","text":"
 See the Pen    Exemple  by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.20.AdvancedExample/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple avan\u00e7at mapicgc-gl-js</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      /*personalitza el teu men\u00fa */\n      #menu-group {\n        position: absolute;\n        top: 10px;\n        left: 10px;\n        color: #000000;\n      }\n\n      #menu-group input[type=\"checkbox\"] + label {\n        background-color: #ffffff !important;\n      }\n\n      #titleDivMenu {\n        background-color: rgb(213 212 212);\n      }\n\n      #titleDivMenuSub {\n        background-color: #e9e9e9;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.DARK,\n          center: [1.808, 41.618],\n          zoom: 10,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        map.on(\"load\", () => {\n          map.addGeocoderICGC();\n          map.addGeolocateControl(\n            {\n              positionOptions: {\n                enableHighAccuracy: true,\n              },\n              trackUserLocation: true,\n            },\n            \"bottom-right\"\n          );\n          map.addFullscreenControl();\n          map.addExportControl();\n\n          map.addTerrainICGC(data.Terrains.ICGC5M, \"bottom-right\");\n          let optionsLayer = {\n            type: \"raster\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"raster-opacity\": 1,\n            },\n            position: \"labels\",\n          };\n\n          // map.addImageLayerICGC(\"orto2013\",mapicgcgl.Layers.Orto.ortofotoColor2013, optionsLayer);\n\n          //add vector icgc\n          let optionsLayerVector = {\n            type: \"line\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"line-color\": \"red\",\n              \"line-width\": 0.2,\n            },\n            position: \"lines\",\n          };\n\n          map.addVectorLayerICGC(\n            \"Municipis\", //ID\n            data.Layers.VectorAdmin.municipisVigent, //Layer\n            optionsLayerVector //options\n          );\n\n          let paintOptions = {\n            \"point-color\": \"yellow\",\n            \"point-width\": 3,\n          };\n          let layerPosition = \"top\"; // select: 'top', 'lines' or 'labels'\n          let filterFieldRutes = \"municipi\"; // select 'all' for view all the features as a single layer\n          let optionsLayerRutes = {\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"line-color\": \"white\",\n              \"line-width\": 3,\n              \"line-opacity\": 1,\n            },\n            layerPosition: \"labels\",\n          };\n\n          map.fetchDataAndMenu(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            filterFieldRutes,\n            optionsLayerRutes\n          );\n\n          let popupStyle = {\n            title: \"Informaci\u00f3:\",\n            image: \"https://tilemaps.icgc.cat/cdn/logos/gencat_logo_color.png\",\n          };\n          let queryFields = [\"nom\", \"municipi\"]; // [] for query all the properties\n          map.addFeatureQuery(\"RutesMontserrat\", queryFields, popupStyle);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.21.Maplibre2Mapicgc/","title":"2.18 Reutilitzaci\u00f3 codi Maplibre","text":""},{"location":"2.21.Maplibre2Mapicgc/#exemple","title":"Exemple","text":"
Exemple de reutilitzaci\u00f3 d'un codi Maplibre a MapICGC GL JS. Les dades utilitzades provenen de Dades Obertes i representen les explotacions agr\u00edcoles de Catalunya a la campanya 2023 gestionades per dones nascudes despr\u00e9s del 1990.
 
 See the Pen    Exemple  by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.21.Maplibre2Mapicgc/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Reutilitzaci\u00f3 codi Maplibre</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n\n     // const map = new maplibregl.Map({  \n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO, // o url directe: 'https://geoserveis.icgc.cat/contextmaps/icgc_mapa_base_gris.json'\n          center: [1.1437, 42.4293],\n          zoom: 12,\n        });\n\n        map.on(\"load\", () => {\n\n       // map.addControl(new maplibregl.NavigationControl());\n          map.addNavigationControl();\n\n       // let scale = new maplibregl.ScaleControl({\n       //     maxWidth: 80,\n       //     unit: 'metric'\n       // });\n       // map.addControl(scale);\n          map.addScaleControl(\n            { maxWidth: 100, unit: \"metric\" },\n            \"bottom-right\"\n          );\n\n          const layers = map.getStyle().layers;\n\n          let firstSymbolId;\n          for (let i = 0; i < layers.length; i++) {\n            if (layers[i].type === \"symbol\") {\n              firstSymbolId = layers[i].id;\n              break;\n            }\n          }\n          map.addSource(\"areas\", {\n            type: \"geojson\",\n            data: \"https://analisi.transparenciacatalunya.cat/resource/iqpi-zasj.geojson?$query=SELECT%0A%20%20%60the_geom%60%2C%0A%20%20%60campanya%60%2C%0A%20%20%60oc%60%2C%0A%20%20%60nom_oc%60%2C%0A%20%20%60ajuts%60%2C%0A%20%20%60codi_pro%60%2C%0A%20%20%60nom_pro%60%2C%0A%20%20%60c_mun_ine%60%2C%0A%20%20%60n_mun_ine%60%2C%0A%20%20%60naturalesa%60%2C%0A%20%20%60data_naix%60%2C%0A%20%20%60ote%60%2C%0A%20%20%60opfh%60%2C%0A%20%20%60codi_dop%60%2C%0A%20%20%60venda_prox%60%2C%0A%20%20%60eap%60%2C%0A%20%20%60id_exp%60%2C%0A%20%20%60ha_dec%60%0AWHERE%0A%20%20caseless_one_of(%60campanya%60%2C%20%222023%22)%0A%20%20AND%20(caseless_one_of(%60naturalesa%60%2C%20%22PF%20Dona%22)%0A%20%20%20%20%20%20%20%20%20AND%20(%60data_naix%60%20%3E%20%221990%22))\",\n          });\n          map.addLayer(\n            {\n              id: \"agric23Dones1990\",\n              type: \"fill\",\n              source: \"areas\",\n              layout: {},\n              paint: {\n                \"fill-color\": \"#f08\",\n                \"fill-opacity\": 0.4,\n              },\n            },\n            firstSymbolId\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.3.AddImageLayerICGC/","title":"2.5 Afegir capa d'imatge ICGC","text":""},{"location":"2.3.AddImageLayerICGC/#exemple","title":"Exemple","text":"
.addImageLayerICGC(url,idLayer,options)
 
 See the Pen    Exemple addImageLayerICGC by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.3.AddImageLayerICGC/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir capa imatge ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 14,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          let optionsLayer = {\n            type: \"raster\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"raster-opacity\": 1,\n            },\n            layerPosition: \"top\",\n          };\n          map.addImageLayerICGC(\n            data.Layers.Orto.ortofotoColor2013,\n            \"orto2013\",\n            optionsLayer\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.3.AddImageLayerICGC/#posicio-layerposition","title":"Posici\u00f3 (layerPosition)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.3.AddImageLayerICGC/#capes-dimatge-icgc","title":"Capes d'imatge ICGC","text":""},{"location":"2.3.AddImageLayerICGC/#layersortoid","title":"Layers.Orto.{id}","text":"id ortofotoColorProvisional ortofotoColor2023 ortofotoColor2022 ortofotoColor2021 ortofotoColor2020 ortofotoColor2019 ortofotoColor2018 ortofotoColor2017 ortofotoColor2016 ortofotoColor2015 ortofotoColor2014 ortofotoColor2013 ortofotoColor2012 ortofotoColor2011 ortofotoColor2010 ortofotoColor2009 ortofotoColor2008 ortofotoColor20062007 ortofotoColor20042005 ortofotoColor20002003 ortofotoBlancINegre1998 ortofotoBlancINegre19941997 ortofotoColor1993 ortofotoBlancINegre19831992 ortofotoBlancINegre19701977 ortofotoBlancINegre1956 ortofotoBlancINegre1945 ortofotoColorSerieAnual ortofotoInfraroigProvisional ortofotoInfraroig2023 ortofotoInfraroig2022 ortofotoInfraroig2021 ortofotoInfraroig2020 ortofotoInfraroig2019 ortofotoInfraroig2018 ortofotoInfraroig2017 ortofotoInfraroig2016 ortofotoInfraroig2015 ortofotoInfraroig2014 ortofotoInfraroig2013 ortofotoInfraroig2012 ortofotoInfraroig2011 ortofotoInfraroig2010 ortofotoInfraroig2009 ortofotoInfraroig2008 ortofotoInfraroig20062007 ortofotoInfraroig19961997 ortofotoInfraroigSerieAnual"},{"location":"2.3.AddImageLayerICGC/#layerswmsid","title":"Layers.WMS.{id}","text":"id espaisInteresGeologic gravimetriaBouguer500000 cobertesSol2018 administratiu simplificat cims"},{"location":"2.4.AddVectorLayerICGC/","title":"2.6 Afegir capa vector ICGC","text":""},{"location":"2.4.AddVectorLayerICGC/#exemple","title":"Exemple","text":"
.addVectorLayerICGC(url,idLayer,options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.4.AddVectorLayerICGC/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir capa vector de l'ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      /* personalitza el teu bot\u00f3 de llegenda: */\n      #toggleLegend {\n        position: absolute;\n        top: 20px;\n        right: 20px;\n        background-color: #3f33eb;\n        color: white;\n        width: 40px;\n        height: 40px;\n        border-radius: 50%;\n        text-align: center;\n        line-height: 40px;\n        cursor: pointer;\n        z-index: 1000;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          let optionsVectorAdmin = {\n            type: \"line\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"line-color\": \"#4832a8\",\n              \"line-opacity\": 1,\n              \"line-width\": 1,\n            },\n            layerPosition: \"top\",\n          };\n\n          let optionsVector = {\n            type: \"fill\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"fill-color\": \"red\",\n            },\n            layerPosition: \"top\",\n          };\n          map.addVectorLayerICGC(\n            data.Layers.Vector.cobertes2018,\n            \"Cobertes\",\n            optionsVector\n          );\n          map.addVectorLayerICGC(\n            data.Layers.VectorAdmin.municipisVigent,\n            \"municipisVigent\",\n            optionsVectorAdmin\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.4.AddVectorLayerICGC/#posicio-position","title":"Posici\u00f3 (position)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.4.AddVectorLayerICGC/#capes-vector-icgc","title":"Capes vector ICGC","text":""},{"location":"2.4.AddVectorLayerICGC/#layersvectoradminid","title":"Layers.VectorAdmin.{id}","text":"id agrupacionsCensals2015 agrupacionsCensals2016 agrupacionsCensals2017 agrupacionsCensals2018 agrupacionsCensals2019 agrupacionsCensals2020 agrupacionsCensals2021 agrupacionsCensalsVigent agrupacionsCensalsVigentText areesBasiquesPolicials2019 areesBasiquesPolicials2020 areesBasiquesPolicials2022 areesBasiquesPolicialsVigent areesBasiquesPolicialsVigentText areesBasiquesSalutVigent areesBasiquesServeisSocialsVigent areesBasiquesServeisSocialsVigentText areesGestioAssistencialVigent areesHidrogeologiquesAquifersVigent catalunyaVigent catalunyaVigentText comarques2022 comarquesVigent comarquesVigentText districtesCensals2015 districtesCensals2016 districtesCensals2017 districtesCensals2018 districtesCensals2019 districtesCensals2020 districtesCensals2021 districtesCensals2022 districtesCensals2023 districtesCensalsVigent districtesCensalsVigentText incendisForestalsVigent incendisForestalsVigentText municipis2022 municipis2022Text municipisVigent municipisVigentText partitsJudicialsVigent partitsJudicialsVigentText plaTerritorial2015 plaTerritorialVigent plaTerritorialVigentText provinciesVigent provinciesVigentText regionsPolicialsVigent regionsPolicialsVigentText regionsSanitariesVigent regionsSanitariesVigentText seccionsCensals2015 seccionsCensals2016 seccionsCensals2017 seccionsCensals2018 seccionsCensals2019 seccionsCensals2020 seccionsCensals2021 seccionsCensals2022 seccionsCensals2023 seccionsCensalsVigent seccionsCensalsVigentText sectorsSanitarisVigent vegueriesVigent vegueriesVigentText"},{"location":"2.4.AddVectorLayerICGC/#layersvectorid","title":"Layers.Vector.{id}","text":"id cobertes2018"},{"location":"2.5.AddLayerGeojson/","title":"2.7 Afegir capa GeoJSON","text":""},{"location":"2.5.AddLayerGeojson/#exemple","title":"Exemple","text":"
.addLayerGeoJSON(url,idLayer,options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.5.AddLayerGeojson/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir capa</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [1.001, 41.759],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        map.on(\"load\", () => {\n          let geojsonLayer = {\n            id: \"geojsonTest\",\n            data: {\n              type: \"Feature\",\n              geometry: {\n                type: \"Polygon\",\n                coordinates: [\n                  [\n                    [1.3119, 41.489],\n                    [1.0119, 41.489],\n                    [1.0119, 42.0489],\n                    [1.3119, 42.0489],\n                  ],\n                ],\n              },\n            },\n            type: \"fill\",\n            layout: {},\n            paint: {\n              \"fill-color\": \"#088\",\n              \"fill-opacity\": 0.8,\n            },\n          };\n          let layerPosition = \"labels\"; // select: 'top', 'lines' or 'labels'\n          map.addLayerGeoJSON(geojsonLayer, layerPosition);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.5.AddLayerGeojson/#posicio-position","title":"Posici\u00f3 (position)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.6.AddLayerTree/","title":"2.8 Afegir llistat de capes","text":""},{"location":"2.6.AddLayerTree/#exemple","title":"Exemple","text":"
.addLayerTree(options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.6.AddLayerTree/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir arbre de capes</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <nav id=\"filter-group\" class=\"filter-group\"></nav>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 6.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        let options = {\n          features: {\n            type: \"FeatureCollection\",\n            features: [\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Rub\u00ed\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [2.0119, 41.489],\n                },\n              },\n\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Moi\u00e0\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [2.119, 41.87],\n                },\n              },\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Les Borges Blanques\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [0.97319, 41.4589],\n                },\n              },\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Berga\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [1.83, 42.163],\n                },\n              },\n            ],\n          },\n          id: \"testLayer\",\n          type: \"geojson\",\n        };\n        map.on(\"load\", () => {\n          map.addLayerTree(options);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.7.AddMarker/","title":"2.9 Afegir marker","text":""},{"location":"2.7.AddMarker/#exemple","title":"Exemple","text":"
.addmarker(options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.7.AddMarker/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir marcador</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      .maplibregl-popup-close-button {\n        color: blue;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        let optionsMarker = {\n          coord: [2.119, 41.87],\n          text: \"Hola Test\",\n          textOffset: 25,\n          options: {color:\"#D08288\"},\n        };\n        map.on(\"load\", () => {\n          map.addMarker(optionsMarker);\n          map.addFullscreenControl({}, \"top-right\");\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.8.AddControl/","title":"2.10 Afegir control","text":""},{"location":"2.8.AddControl/#exemple","title":"Exemple","text":"
.addControl(control,position)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.8.AddControl/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir control</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <link\n      rel=\"stylesheet\"\n      href=\"https://unpkg.com/maplibre-gl@4.0.0/dist/maplibre-gl.css\"\n    />\n    <script src=\"https://unpkg.com/maplibre-gl@4.0.0/dist/maplibre-gl.js\"></script>\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n\n          map.addFullscreenControl({}, \"top-right\");\n          map.addGeolocateControl(\n            {\n              positionOptions: {\n                enableHighAccuracy: true,\n              },\n              trackUserLocation: true,\n            },\n            \"bottom-right\"\n          );\n\n          //control export amb opcions\n          // map.addExportControl(\n          //   {\n          //     PageSize: Size.A4,\n          //     PageOrientation: PageOrientation.Landscape,\n          //     Format: Format.PNG,\n          //     DPI: DPI[300],\n          //     Crosshair: true,\n          //     PrintableArea: true,\n          //   },\n          //   \"bottom-right\"\n          // );\n          //control export per defecte\n          map.addExportControl();\n\n          // control d'una biblioteca externa\n          map.addControl(new maplibregl.NavigationControl(), \"bottom-right\");\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.8.AddControl/#addgeolocatecontroloptions-position","title":"addGeolocateControl(options, position)","text":"
map.addGeolocateControl(); ; //default version \nmap.addGeolocateControl({\npositionOptions: { enableHighAccuracy: true }, trackUserLocation: true\n},\"bottom-right\")\n
"},{"location":"2.8.AddControl/#addexportcontroloptions-position","title":"addExportControl(options, position)","text":"
map.addExportControl() ; //default version \nmap.addExportControl({ PageSize:\nSize.A4, PageOrientation:PageOrientation.Landscape, Format: Format.PNG, DPI:\nDPI[300], Crosshair: true, PrintableArea: true, }, \"bottom-right\")\n
"},{"location":"2.8.AddControl/#addmousecoordcontroloptions-position","title":"addMouseCoordControl(options, position)","text":"
map.addMouseCoordControl(); //default version\nmap.addMouseCoordControl({width:'225px',utm:true,lonlat:true},\"bottom-left\");\n
"},{"location":"2.8.AddControl/#addfullscreencontroloptions-position","title":"addFullscreenControl(options, position)","text":"
map.addFullscreenControl(); //default version\nmap.addFullscreenControl({container: HTMLElement}, 'top-right');\n
"},{"location":"2.8.AddControl/#addscalecontroloptions-position","title":"addScaleControl(options, position)","text":"
map.addScaleControl(); //default version \nmap.addScaleControl({maxWidth: 100,\nunit: 'metric' ('imperial', 'metric' or 'nautical')}, \"top-right\");\n
"},{"location":"2.8.AddControl/#addnavigationcontroloptions-position","title":"addNavigationControl(options, position)","text":"
map.addNavigationControl(); //default version\nmap.addMouseCoordControl({showCompass: true, showZoom: true, visualizePitch:\ntrue}, \"top-right\");\n
"},{"location":"2.8.AddControl/#addattributioncontroloptions-position","title":"addAttributionControl(options, position)","text":"
map.addAttributionControl(); //default version\nmap.addAttributionControl({compact: true, customAttribution: \"your custom\nattribution\" }, \"bottom-right\");\n
"},{"location":"2.9.AddCompare/","title":"2.11 Afegir comparador","text":""},{"location":"2.9.AddCompare/#exemple","title":"Exemple","text":"
.CompareMaps(options)
 
 See the Pen    CompareMaps by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.9.AddCompare/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir comparador</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://tilemaps.icgc.cat/cdn/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      .map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"comparison-container\">\n      <div id=\"before\" class=\"map\"></div>\n      <div id=\"after\" class=\"map\"></div>\n    </div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n\n        const map1 = new mapicgcgl.Map({\n          container: \"before\",\n          style: data.Styles.ORTO,\n          center: [1.1464, 41.706],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        const map2 = new mapicgcgl.Map({\n          container: \"after\",\n          style: data.Styles.TOPO,\n          center: [1.1464, 41.706],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        var container = \"#comparison-container\";\n\n        var map = new mapicgcgl.CompareMaps(map1, map2, container, {});\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"3.1.Funcions_doc/","title":"3.1 Funcions","text":""},{"location":"3.1.Funcions_doc/#lnglatbounds","title":"LngLatBounds","text":"
LngLatBounds
 
Kind: global class 
"},{"location":"3.1.Funcions_doc/#new-lnglatboundssw-ne","title":"new LngLatBounds([sw], [ne])","text":"
Constructs a new LngLatBounds object representing a geographical bounding box.
 Param Type Description [sw] LngLatLike The southwest corner of the bounding box. Can be specified as an array of 4 numbers in the order of west, south, east, north, or an array of 2 LngLatLike representing [sw,ne]. [ne] LngLatLike The northeast corner of the bounding box. 
"},{"location":"3.1.Funcions_doc/#addgeocodericgcposition-object","title":"addGeocoderICGC([position]) \u2192Object","text":"
Add geocoder.
 
Kind: global function Returns: Object - - The current position of the search result.  
 Param Type Default Description [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#getconfigstyles-array","title":"getConfigStyles() \u2192Array","text":"
Retrieves the available base styles from default options.
 
Kind: global function Returns: Array - - Array containing the names of available base styles. 
"},{"location":"3.1.Funcions_doc/#getconfigwmslayers-array","title":"getConfigWMSLayers() \u2192Array","text":"
Retrieves the available WMS image layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available WMS image layers. 
"},{"location":"3.1.Funcions_doc/#getconfigortolayers-array","title":"getConfigOrtoLayers() \u2192Array","text":"
Retrieves the available orto image layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available image layers. 
"},{"location":"3.1.Funcions_doc/#getconfigvectorlayers-array","title":"getConfigVectorLayers() \u2192Array","text":"
Retrieves the available vector layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available vector layers. 
"},{"location":"3.1.Funcions_doc/#getconfigvectoradminlayers-array","title":"getConfigVectorAdminLayers() \u2192Array","text":"
Retrieves the available vector layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available vectorAdmin layers. 
"},{"location":"3.1.Funcions_doc/#getconfigfgbadminlayers-array","title":"getConfigFGBAdminLayers() \u2192Array","text":"
Retrieves the available fgb layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available fgbadmin layers. 
"},{"location":"3.1.Funcions_doc/#fetchdataurl-idlayer-options","title":"fetchData(url, idLayer, options)","text":"
Fetches GeoJSON data from a URL and adds a corresponding layer to the map based on the specified geometry type.
 
Kind: global function  
 Param Type Description url string The URL to fetch GeoJSON data from. idLayer string The id for the layer. options Object Additional options for configuring the layer. 
"},{"location":"3.1.Funcions_doc/#fetchdataandmenuurl-idlayer-filterfield-options","title":"fetchDataAndMenu(url, idLayer, filterField, options)","text":"
Fetches GeoJSON data from a URL and adds a corresponding layer to the map based on the specified geometry type and adds to the Menu as a checkbox item.
 
Kind: global function  
 Param Type Description url string The URL to fetch GeoJSON data from. idLayer string The geometry name (e.g., 'buildings'). filterField string Import all features as unique or group based on a field ('all', 'field'). options Object Additional options for configuring the layer. 
"},{"location":"3.1.Funcions_doc/#ontype-func","title":"on(type, func)","text":"
Adds an event listener to the map.
 
Kind: global function  
 Param Type Description type string The type of the event. func function The callback function to be executed when the event occurs. 
"},{"location":"3.1.Funcions_doc/#setstylestyle-options","title":"setStyle(style, [options])","text":"
Sets the style of the map.
 
Kind: global function  
 Param Type Description style string Name of the map style. [options] Object Options for setting the style. 
"},{"location":"3.1.Funcions_doc/#addcontrolcontrol-position","title":"addControl(control, [position])","text":"
Adds a control to the map with the specified position.
 
Kind: global function  
 Param Type Default Description control Object The control to add. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#setskyoptions","title":"setSky(options)","text":"
Sets the sky properties of the map.
 
Kind: global function  
 Param Type Default Description options Object Options to set the sky properties. [options.skyType] string \"'gradient'\" Type of sky to set (e.g., 'gradient', 'atmosphere'). [options.color] string \"'lightblue'\" Color of the sky. [options.horizonBlend] Number 0.03 Blend horizon value. [options.starIntensity] Number 0.5 Intensity of stars in the sky. [options.sunIntensity] Number 0.1 Intensity of the sun in the sky. [options.sunPosition] Array.<Number> [0, 0] Position of the sun in the sky. 
"},{"location":"3.1.Funcions_doc/#addmousecoordcontrolposition","title":"addMouseCoordControl([position])","text":"
Adds a mouse coordinate control to the map.
 
Kind: global function  
 Param Type Default Description options.width Number Width control i. options.utm Boolean Boolean to show coordinates in UTM. options.lonlat Boolean Boolean to show coordinates in Lon Lat. [position] string \"'bottom-left'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addgeolocatecontroloptions-position","title":"addGeolocateControl(options, [position])","text":"
Adds a geolocate control to the map.
 
Kind: global function  
 Param Type Default Description options Object Options for the geolocate control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addfullscreencontroloptions-position","title":"addFullscreenControl(options, [position])","text":"
Adds a fullscreen control to the map.
 
Kind: global function  
 Param Type Default Description options Object Options for the geolocate control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addlayerlayer-layeridorder","title":"addLayer(layer, layerIdOrder)","text":"
Adds a layer to the map.
 
Kind: global function  
 Param Type Description layer Object Options for the layer to add. layerIdOrder string Optional layer Id draw position. 
"},{"location":"3.1.Funcions_doc/#addimageid-image-options-this","title":"addImage(id, image, options) \u2192this","text":"
Adds an image to the map.
 
Kind: global function  
 Param Type Description id string The ID of the image. image ImageBitmap | HTMLImageElement | ImageData | StyleImageInterface | object The image object to add. options Partial.<StyleImageMetadata> Optional metadata for the image. 
"},{"location":"3.1.Funcions_doc/#addsourceid-source-this","title":"addSource(id, source) \u2192this","text":"
Adds a source to the map.
 
Kind: global function  
 Param Type Description id string The ID of the source. source SourceSpecification The source object to add. 
"},{"location":"3.1.Funcions_doc/#addspriteid-url-options-this","title":"addSprite(id, url, options) \u2192this","text":"
Adds a sprite to the map.
 
Kind: global function  
 Param Type Description id string The ID of the sprite. url string The URL to load the sprite from. options StyleSetterOptions Options object. 
"},{"location":"3.1.Funcions_doc/#aretilesloaded-boolean","title":"areTilesLoaded() \u2192boolean","text":"
Checks if all tiles in the viewport are loaded.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#cameraforboundsbounds-options-centerzoombearing-undefined","title":"cameraForBounds(bounds, options) \u2192CenterZoomBearing | undefined","text":"
Calculates the camera position for given bounds.
 
Kind: global function  
 Param Type Description bounds LngLatBoundsLike The geographical bounds to fit. options CameraForBoundsOptions Options object. 
"},{"location":"3.1.Funcions_doc/#easetooptions-eventdata-this","title":"easeTo(options, eventData) \u2192this","text":"
Eases the camera to a new position.
 
Kind: global function  
 Param Type Description options object Options describing the animation. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#fitboundsbounds-options-eventdata-this","title":"fitBounds(bounds, options, eventData) \u2192this","text":"
Fits the map to the given geographical bounds.
 
Kind: global function  
 Param Type Description bounds LngLatBoundsLike The geographical bounds to fit. options FitBoundsOptions Options object. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#fitscreencoordinatesp0-p1-bearing-options-eventdata-this","title":"fitScreenCoordinates(p0, p1, bearing, options, eventData) \u2192this","text":"
Fits the map to the given screen coordinates.
 
Kind: global function  
 Param Type Description p0 PointLike First point on screen, in pixel coordinates. p1 PointLike Second point on screen, in pixel coordinates. bearing number Desired map bearing at end of animation, in degrees. options FitBoundsOptions Options object. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#flytooptions-eventdata-this","title":"flyTo(options, eventData) \u2192this","text":"
Flies the camera to a new position.
 
Kind: global function  
 Param Type Description options FlyToOptions Options describing the flight. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#getbearing-number","title":"getBearing() \u2192number","text":"
Gets the current bearing of the map.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getbounds-lnglatbounds","title":"getBounds() \u2192LngLatBounds","text":"
Gets the current geographical bounds of the map.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcameratargetelevation-number","title":"getCameraTargetElevation() \u2192number","text":"
Gets the elevation for the point where the camera is looking.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcanvas-htmlcanvaselement","title":"getCanvas() \u2192HTMLCanvasElement","text":"
Gets the map's  element. 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcanvascontainer-htmlelement","title":"getCanvasContainer() \u2192HTMLElement","text":"
Gets the HTML element containing the map's  element. 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcenter-lnglat","title":"getCenter() \u2192LngLat","text":"
Returns the map's geographical centerpoint.
 
Kind: global function Returns: LngLat - The map's geographical centerpoint. 
"},{"location":"3.1.Funcions_doc/#getcontainer-htmlelement","title":"getContainer() \u2192HTMLElement","text":"
Returns the map's containing HTML element.
 
Kind: global function Returns: HTMLElement - The map's container. 
"},{"location":"3.1.Funcions_doc/#getfeaturestatefeature-any","title":"getFeatureState(feature) \u2192any","text":"
Gets the state of a feature.
 
Kind: global function Returns: any - The state of the feature.  
 Param Type Description feature FeatureIdentifier Feature identifier. 
"},{"location":"3.1.Funcions_doc/#getfilterlayerid-void-filterspecification","title":"getFilter(layerId) \u2192void | FilterSpecification","text":"
Returns the filter applied to the specified style layer.
 
Kind: global function Returns: void | FilterSpecification - The layer's filter.  
 Param Type Description layerId string The ID of the style layer. 
"},{"location":"3.1.Funcions_doc/#getglyphs-string","title":"getGlyphs() \u2192string","text":"
Returns the value of the style's glyphs URL.
 
Kind: global function Returns: string - The glyphs Style's glyphs URL. 
"},{"location":"3.1.Funcions_doc/#getimageid-styleimage","title":"getImage(id) \u2192StyleImage","text":"
Returns an image currently available in the map.
 
Kind: global function Returns: StyleImage - An image in the map with the specified ID.  
 Param Type Description id string The ID of the image. 
"},{"location":"3.1.Funcions_doc/#getlayerid-stylelayer","title":"getLayer(id) \u2192StyleLayer","text":"
Returns the layer with the specified ID in the map's style.
 
Kind: global function Returns: StyleLayer - The layer with the specified ID.  
 Param Type Description id string The ID of the layer to get. 
"},{"location":"3.1.Funcions_doc/#getlayersorder-arraystring","title":"getLayersOrder() \u2192Array.<string>","text":"
Return the ids of all layers currently in the style, including custom layers, in order.
 
Kind: global function Returns: Array.<string> - Ids of layers, in order. 
"},{"location":"3.1.Funcions_doc/#getlayoutpropertylayerid-name-any","title":"getLayoutProperty(layerId, name) \u2192any","text":"
Returns the value of a layout property in the specified style layer.
 
Kind: global function Returns: any - The value of the specified layout property.  
 Param Type Description layerId string The ID of the layer. name string The name of the layout property. 
"},{"location":"3.1.Funcions_doc/#getlight-lightspecification","title":"getLight() \u2192LightSpecification","text":"
Returns the value of the light object.
 
Kind: global function Returns: LightSpecification - Light properties of the style. 
"},{"location":"3.1.Funcions_doc/#getmaxbounds-lnglatbounds","title":"getMaxBounds() \u2192LngLatBounds","text":"
Returns the maximum geographical bounds the map is constrained to.
 
Kind: global function Returns: LngLatBounds - The map's maximum geographical bounds. 
"},{"location":"3.1.Funcions_doc/#getmaxpitch-number","title":"getMaxPitch() \u2192number","text":"
Returns the map's maximum allowable pitch.
 
Kind: global function Returns: number - The maxPitch. 
"},{"location":"3.1.Funcions_doc/#getmaxzoom-number","title":"getMaxZoom() \u2192number","text":"
Returns the map's maximum allowable zoom level.
 
Kind: global function Returns: number - The maxZoom. 
"},{"location":"3.1.Funcions_doc/#getminpitch-number","title":"getMinPitch() \u2192number","text":"
Returns the map's minimum allowable pitch.
 
Kind: global function Returns: number - The minPitch. 
"},{"location":"3.1.Funcions_doc/#getminzoom-number","title":"getMinZoom() \u2192number","text":"
Returns the map's minimum allowable zoom level.
 
Kind: global function Returns: number - The minZoom. 
"},{"location":"3.1.Funcions_doc/#getpadding-paddingoptions","title":"getPadding() \u2192PaddingOptions","text":"
Returns the current padding applied around the map viewport.
 
Kind: global function Returns: PaddingOptions - The current padding around the map viewport. 
"},{"location":"3.1.Funcions_doc/#getpaintpropertylayerid-name-unknown","title":"getPaintProperty(layerId, name) \u2192unknown","text":"
Returns the value of a paint property in the specified style layer.
 
Kind: global function Returns: unknown - The value of the specified paint property.  
 Param Type Description layerId string The ID of the layer. name string The name of a paint property. 
"},{"location":"3.1.Funcions_doc/#getpitch-number","title":"getPitch() \u2192number","text":"
Returns the map's current pitch (tilt).
 
Kind: global function Returns: number - The map's current pitch, measured in degrees away from the plane of the screen. 
"},{"location":"3.1.Funcions_doc/#getpixelratio-number","title":"getPixelRatio() \u2192number","text":"
Returns the map's pixel ratio.
 
Kind: global function Returns: number - The pixel ratio. 
"},{"location":"3.1.Funcions_doc/#getrenderworldcopies-boolean","title":"getRenderWorldCopies() \u2192boolean","text":"
Returns the state of renderWorldCopies.
 
Kind: global function Returns: boolean - The renderWorldCopies. 
"},{"location":"3.1.Funcions_doc/#getsourceid-source","title":"getSource(id) \u2192Source","text":"
Returns the source with the specified ID in the map's style.
 
Kind: global function Returns: Source - The style source with the specified ID.  
 Param Type Description id string The ID of the source to get. 
"},{"location":"3.1.Funcions_doc/#getsprite-arrayobject","title":"getSprite() \u2192Array.<object>","text":"
Returns the as-is value of the style's sprite.
 
Kind: global function Returns: Array.<object> - Style's sprite list of id-url pairs. 
"},{"location":"3.1.Funcions_doc/#getstyle-stylespecification","title":"getStyle() \u2192StyleSpecification","text":"
Returns the map's MapLibre style object.
 
Kind: global function Returns: StyleSpecification - The map's style JSON object. 
"},{"location":"3.1.Funcions_doc/#getterrain-terrainspecification","title":"getTerrain() \u2192TerrainSpecification","text":"
Get the terrain-options if terrain is loaded.
 
Kind: global function Returns: TerrainSpecification - The TerrainSpecification passed to setTerrain. 
"},{"location":"3.1.Funcions_doc/#getzoom-number","title":"getZoom() \u2192number","text":"
Returns the map's current zoom level.
 
Kind: global function Returns: number - The map's current zoom level. 
"},{"location":"3.1.Funcions_doc/#hascontrolcontrol-boolean","title":"hasControl(control) \u2192boolean","text":"
Checks if a control exists on the map.
 
Kind: global function Returns: boolean - true if map contains control.  
 Param Type Description control IControl The IControl to check. 
"},{"location":"3.1.Funcions_doc/#hasimageid-boolean","title":"hasImage(id) \u2192boolean","text":"
Check whether or not an image with a specific ID exists in the style.
 
Kind: global function Returns: boolean - A Boolean indicating whether the image exists.  
 Param Type Description id string The ID of the image. 
"},{"location":"3.1.Funcions_doc/#ismoving-boolean","title":"isMoving() \u2192boolean","text":"
Returns true if the map is panning, zooming, rotating, or pitching due to a camera animation or user gesture.
 
Kind: global function Returns: boolean - true if the map is moving. 
"},{"location":"3.1.Funcions_doc/#isrotating-boolean","title":"isRotating() \u2192boolean","text":"
Returns true if the map is rotating due to a camera animation or user gesture.
 
Kind: global function Returns: boolean - true if the map is rotating. 
"},{"location":"3.1.Funcions_doc/#issourceloadedid-boolean","title":"isSourceLoaded(id) \u2192boolean","text":"
Returns a Boolean indicating whether the source is loaded.
 
Kind: global function Returns: boolean - A Boolean indicating whether the source is loaded.  
 Param Type Description id string The ID of the source to be checked. 
"},{"location":"3.1.Funcions_doc/#isstyleloaded-boolean-void","title":"isStyleLoaded() \u2192boolean | void","text":"
Returns a Boolean indicating whether the map's style is fully loaded.
 
Kind: global function Returns: boolean | void - A Boolean indicating whether the style is fully loaded. 
"},{"location":"3.1.Funcions_doc/#iszooming-boolean","title":"isZooming() \u2192boolean","text":"
Returns true if the map is zooming due to a camera animation or user gesture.
 
Kind: global function Returns: boolean - true if the map is zooming. 
"},{"location":"3.1.Funcions_doc/#jumptooptions-eventdata-this","title":"jumpTo(options, [eventData]) \u2192this","text":"
Changes any combination of center, zoom, bearing, and pitch, without an animated transition.
 
Kind: global function  
 Param Type Description options JumpToOptions Options object [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#listimages-arraystring","title":"listImages() \u2192Array.<string>","text":"
Returns an Array of strings containing the IDs of all images currently available in the map.
 
Kind: global function Returns: Array.<string> - An Array of strings containing the names of all sprites/images currently available in the map. 
"},{"location":"3.1.Funcions_doc/#listenstype-boolean","title":"listens(type) \u2192boolean","text":"
Returns a true if this instance of Evented or any forwardeed instances of Evented have a listener for the specified type.
 
Kind: global function Returns: boolean - true if there is at least one registered listener for specified event type, false otherwise.  
 Param Type Description type string The event type. 
"},{"location":"3.1.Funcions_doc/#loadimageurl-promisegetresourceresponseimagebitmaphtmlimageelement","title":"loadImage(url) \u2192Promise.<GetResourceResponse.<(ImageBitmap|HTMLImageElement)>>","text":"
Load an image from an external URL to be used with Map#addImage.
 
Kind: global function Returns: Promise.<GetResourceResponse.<(ImageBitmap|HTMLImageElement)>> - A promise that is resolved when the image is loaded.  
 Param Type Description url string The URL of the image file. Image file must be in png, webp, or jpg format. 
"},{"location":"3.1.Funcions_doc/#loaded-boolean","title":"loaded() \u2192boolean","text":"
Returns a Boolean indicating whether the map is fully loaded.
 
Kind: global function Returns: boolean - A Boolean indicating whether the map is fully loaded. 
"},{"location":"3.1.Funcions_doc/#addprotocolcustomprotocol-loadfn-void","title":"addProtocol(customProtocol, loadFn) \u2192void","text":"
Adds a custom load resource function that will be called when using a URL that starts with a custom URL schema.
 
Kind: global function  
 Param Type Description customProtocol string The protocol to hook, for example 'custom'. loadFn AddProtocolAction The function to use when trying to fetch a resource specified by the customProtocol. 
"},{"location":"3.1.Funcions_doc/#movelayerid-beforeid-this","title":"moveLayer(id, [beforeId]) \u2192this","text":"
Moves a layer to a different z-position.
 
Kind: global function  
 Param Type Description id string The ID of the layer to move. [beforeId] string The ID of an existing layer to insert the new layer before. 
"},{"location":"3.1.Funcions_doc/#panbyoffset-options-eventdata-this","title":"panBy(offset, [options], [eventData]) \u2192this","text":"
Pans the map by the specified offset.
 
Kind: global function  
 Param Type Description offset PointLike x and y coordinates by which to pan the map. [options] AnimationOptions Options object. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#pantolnglat-options-eventdata-this","title":"panTo(lnglat, [options], [eventData]) \u2192this","text":"
Pans the map to the specified location with an animated transition.
 
Kind: global function  
 Param Type Description lnglat LngLatLike The location to pan the map to. [options] AnimationOptions Options describing the destination and animation of the transition. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#projectlnglat-point","title":"project(lnglat) \u2192Point","text":"
Returns a Point representing pixel coordinates, relative to the map's container, that correspond to the specified geographical location.
 
Kind: global function Returns: Point - The Point corresponding to lnglat, relative to the map's container.  
 Param Type Description lnglat LngLatLike The geographical location to project. 
"},{"location":"3.1.Funcions_doc/#queryrenderedfeaturesgeometryoroptions-options-array","title":"queryRenderedFeatures([geometryOrOptions], [options]) \u2192Array","text":"
Queries rendered features within a specified geometry or bounding box.
 
Kind: global function Returns: Array - An array of GeoJSON Feature objects representing the features that intersect the query geometry.  
 Param Type Description [geometryOrOptions] GeometryLike | Array | Object The geometry or options for the query. [options] Object Options for the query. 
"},{"location":"3.1.Funcions_doc/#querysourcefeaturessourceid-parameters-array","title":"querySourceFeatures(sourceId, parameters) \u2192Array","text":"
Queries source features within a specified source.
 
Kind: global function Returns: Array - An array of GeoJSON Feature objects representing the features in the source that satisfy the query parameters.  
 Param Type Description sourceId string The ID of the source to query. parameters Object Parameters for the query. 
"},{"location":"3.1.Funcions_doc/#queryterrainelevationlnglatlike-number","title":"queryTerrainElevation(lngLatLike) \u2192number","text":"
Queries the terrain elevation at a specified geographical location.
 
Kind: global function Returns: number - The elevation (in meters) at the specified location.  
 Param Type Description lngLatLike LngLatLike The geographical location to query. 
"},{"location":"3.1.Funcions_doc/#redraw-this","title":"redraw() \u2192this","text":"
Redraws the map.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#remove-this","title":"remove() \u2192this","text":"
Removes the map from the DOM.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#removecontrolcontrol-this","title":"removeControl(control) \u2192this","text":"
Removes a control from the map.
 
Kind: global function  
 Param Type Description control Object The control to remove. 
"},{"location":"3.1.Funcions_doc/#removefeaturestatetarget-key-this","title":"removeFeatureState(target, [key]) \u2192this","text":"
Removes the state of a feature.
 
Kind: global function  
 Param Type Description target Object The target feature. [key] string The key of the state to remove. 
"},{"location":"3.1.Funcions_doc/#removeimageid-this","title":"removeImage(id) \u2192this","text":"
Removes an image from the style's sprite.
 
Kind: global function  
 Param Type Description id string The ID of the image to remove. 
"},{"location":"3.1.Funcions_doc/#removelayeridlayer","title":"removeLayer(idLayer)","text":"
Removes a layer from the map.
 
Kind: global function  
 Param Type Description idLayer string Identifier of the layer to remove. 
"},{"location":"3.1.Funcions_doc/#removesourceidlayer","title":"removeSource(idLayer)","text":"
Removes a source from the map.
 
Kind: global function  
 Param Type Description idLayer string Identifier of the source to remove. 
"},{"location":"3.1.Funcions_doc/#removespriteid-this","title":"removeSprite(id) \u2192this","text":"
Removes a sprite from the style.
 
Kind: global function  
 Param Type Description id string The ID of the sprite to remove. 
"},{"location":"3.1.Funcions_doc/#resetnorthoptions-eventdata-this","title":"resetNorth([options], [eventData]) \u2192this","text":"
Resets the map orientation so that north is up.
 
Kind: global function  
 Param Type Description [options] Object Options for the reset. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#resetnorthpitchoptions-eventdata-this","title":"resetNorthPitch([options], [eventData]) \u2192this","text":"
Resets the map orientation so that north is up and pitch is set to 0\u252c\u2591.
 
Kind: global function  
 Param Type Description [options] Object Options for the reset. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#resizeeventdata-this","title":"resize([eventData]) \u2192this","text":"
Resizes the map to fit its container.
 
Kind: global function  
 Param Type Description [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#rotatetobearing-options-eventdata-this","title":"rotateTo(bearing, [options], [eventData]) \u2192this","text":"
Rotates the map to the specified bearing with an animated transition.
 
Kind: global function  
 Param Type Description bearing number The desired bearing (in degrees) to rotate the map to. [options] Object Options for the rotation. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setbearingbearing-eventdata-this","title":"setBearing(bearing, [eventData]) \u2192this","text":"
Sets the map's bearing with an optional animated transition.
 
Kind: global function  
 Param Type Description bearing number The desired bearing (in degrees) to set for the map. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setcentercenter-eventdata-this","title":"setCenter(center, [eventData]) \u2192this","text":"
Sets the map's center coordinates with an optional animated transition.
 
Kind: global function  
 Param Type Description center LngLatLike The desired center coordinates to set for the map. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#seteventedparentparent-data-this","title":"setEventedParent([parent], [data]) \u2192this","text":"
Sets the parent of the map's event emitter.
 
Kind: global function  
 Param Type Description [parent] any The parent object to set for the event emitter. [data] any Additional data to pass to the parent. 
"},{"location":"3.1.Funcions_doc/#setfeaturestatefeature-state-this","title":"setFeatureState(feature, state) \u2192this","text":"
Sets the state of a feature.
 
Kind: global function  
 Param Type Description feature Object The feature to set the state for. state Object The state object to set for the feature. 
"},{"location":"3.1.Funcions_doc/#setfilterlayerid-filter-options-this","title":"setFilter(layerId, [filter], [options]) \u2192this","text":"
Sets the filter for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the filter for. [filter] Array The filter array to apply to the layer. [options] Object Options for the filter. 
"},{"location":"3.1.Funcions_doc/#setglyphsglyphsurl-options-this","title":"setGlyphs(glyphsUrl, [options]) \u2192this","text":"
Sets the glyphs for the map's style.
 
Kind: global function  
 Param Type Description glyphsUrl string The URL to the glyphs. [options] Object Options for setting the glyphs. 
"},{"location":"3.1.Funcions_doc/#setlayerzoomrangelayerid-minzoom-maxzoom-this","title":"setLayerZoomRange(layerId, minzoom, maxzoom) \u2192this","text":"
Sets the zoom range for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the zoom range for. minzoom number The minimum zoom level for the layer. maxzoom number The maximum zoom level for the layer. 
"},{"location":"3.1.Funcions_doc/#setlayoutpropertylayerid-name-value-options-this","title":"setLayoutProperty(layerId, name, value, [options]) \u2192this","text":"
Sets a layout property for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the layout property for. name string The name of the layout property to set. value any The value to set for the layout property. [options] Object Options for setting the layout property. 
"},{"location":"3.1.Funcions_doc/#setlightlight-options-this","title":"setLight(light, [options]) \u2192this","text":"
Sets the light for the map's style.
 
Kind: global function  
 Param Type Description light Object The light object to set for the map. [options] Object Options for setting the light. 
"},{"location":"3.1.Funcions_doc/#setmaxboundsbounds-this","title":"setMaxBounds(bounds) \u2192this","text":"
Sets the maximum bounds for the map.
 
Kind: global function  
 Param Type Description bounds Array The maximum bounds for the map. 
"},{"location":"3.1.Funcions_doc/#setmaxpitchmaxpitch-this","title":"setMaxPitch(maxPitch) \u2192this","text":"
Sets the maximum pitch for the map.
 
Kind: global function  
 Param Type Description maxPitch number The maximum pitch (in degrees) for the map. 
"},{"location":"3.1.Funcions_doc/#setmaxzoommaxzoom-this","title":"setMaxZoom(maxZoom) \u2192this","text":"
Sets the maximum zoom level for the map.
 
Kind: global function  
 Param Type Description maxZoom number The maximum zoom level for the map. 
"},{"location":"3.1.Funcions_doc/#setminpitchminpitch-this","title":"setMinPitch(minPitch) \u2192this","text":"
Sets the minimum pitch for the map.
 
Kind: global function  
 Param Type Description minPitch number The minimum pitch (in degrees) for the map. 
"},{"location":"3.1.Funcions_doc/#setminzoomminzoom-this","title":"setMinZoom(minZoom) \u2192this","text":"
Sets the minimum zoom level for the map.
 
Kind: global function  
 Param Type Description minZoom number The minimum zoom level for the map. 
"},{"location":"3.1.Funcions_doc/#setpaddingpadding-eventdata-this","title":"setPadding(padding, [eventData]) \u2192this","text":"
Sets padding for the map's container.
 
Kind: global function  
 Param Type Description padding Object The padding object to set for the map's container. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setpaintpropertylayerid-name-value-options-this","title":"setPaintProperty(layerId, name, value, [options]) \u2192this","text":"
Sets a paint property for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the paint property for. name string The name of the paint property to set. value any The value to set for the paint property. [options] Object Options for setting the paint property. 
"},{"location":"3.1.Funcions_doc/#setpitchpitch-eventdata-this","title":"setPitch(pitch, [eventData]) \u2192this","text":"
Sets the map's pitch angle with an optional animated transition.
 
Kind: global function  
 Param Type Description pitch number The desired pitch angle (in degrees) to set for the map. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setpixelratiopixelratio-this","title":"setPixelRatio(pixelRatio) \u2192this","text":"
Sets the pixel ratio for the map.
 
Kind: global function  
 Param Type Description pixelRatio number The desired pixel ratio for the map. 
"},{"location":"3.1.Funcions_doc/#setrenderworldcopiesrenderworldcopies-this","title":"setRenderWorldCopies(renderWorldCopies) \u2192this","text":"
Sets whether the map should render world copies when the center longitude is greater than or less than \u252c\u2592180 degrees.
 
Kind: global function  
 Param Type Description renderWorldCopies boolean A boolean indicating whether to render world copies. 
"},{"location":"3.1.Funcions_doc/#setspritespriteurl-options-this","title":"setSprite(spriteUrl, [options]) \u2192this","text":"
Sets the sprite for the map's style.
 
Kind: global function  
 Param Type Description spriteUrl string The URL to the sprite. [options] Object Options for setting the sprite. 
"},{"location":"3.1.Funcions_doc/#setterrainoptions-this","title":"setTerrain(options) \u2192this","text":"
Loads a 3D terrain mesh based on a \"raster-dem\" source.
 
Kind: global function  
 Param Type Description options TerrainSpecification Options object specifying the terrain source. 
"},{"location":"3.1.Funcions_doc/#settransformrequesttransformrequest-this","title":"setTransformRequest(transformRequest) \u2192this","text":"
Updates the requestManager's transform request with a new function.
 
Kind: global function  
 Param Type Description transformRequest RequestTransformFunction The callback function to update the transform request. 
"},{"location":"3.1.Funcions_doc/#setzoomzoom-eventdata-this","title":"setZoom(zoom, [eventData]) \u2192this","text":"
Sets the map's zoom level.
 
Kind: global function  
 Param Type Description zoom number The zoom level to set (0-20). [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#snaptonorthoptions-eventdata-this","title":"snapToNorth([options], [eventData]) \u2192this","text":"
Snaps the map so that north is up (0\u252c\u2591 bearing), if the current bearing is close enough to it.
 
Kind: global function  
 Param Type Description [options] Object Options for snapping to north. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#stop-this","title":"stop() \u2192this","text":"
Stops any animated transition underway.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#triggerrepaint-void","title":"triggerRepaint() \u2192void","text":"
Triggers the rendering of a single frame.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#unprojectpoint-lnglat","title":"unproject(point) \u2192LngLat","text":"
Returns geographical coordinates corresponding to the specified pixel coordinates.
 
Kind: global function Returns: LngLat - The geographical coordinates corresponding to the specified pixel coordinates.  
 Param Type Description point PointLike The pixel coordinates to unproject. 
"},{"location":"3.1.Funcions_doc/#updateimageid-image-this","title":"updateImage(id, image) \u2192this","text":"
Updates an existing image in the style's sprite.
 
Kind: global function  
 Param Type Description id string The ID of the image to update. image ImageBitmap | HTMLImageElement | ImageData | StyleImageInterface | object The new image data. 
"},{"location":"3.1.Funcions_doc/#zoominoptions-eventdata-this","title":"zoomIn([options], [eventData]) \u2192this","text":"
Increases the map's zoom level by 1.
 
Kind: global function  
 Param Type Description [options] Object Options for zooming in. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#zoomoutoptions-eventdata-this","title":"zoomOut([options], [eventData]) \u2192this","text":"
Decreases the map's zoom level by 1.
 
Kind: global function  
 Param Type Description [options] Object Options for zooming out. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#zoomtozoom-options-eventdata-this","title":"zoomTo(zoom, [options], [eventData]) \u2192this","text":"
Zooms the map to the specified zoom level with an animated transition.
 
Kind: global function  
 Param Type Description zoom number The zoom level to transition to. [options] Object Options for zooming to. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#addlayergeojsonlayer-layerposition","title":"addLayerGeoJSON(layer, layerPosition)","text":"
Adds a GeoJSON layer to the map.
 
Kind: global function  
 Param Type Description layer Object Options for the GeoJSON layer to add. layer.id string Unique identifier for the layer. layer.data Object GeoJSON data for the layer. layer.type string Map layer type (e.g., 'symbol', 'circle', 'fill').   * layer.layout Object Layer layout configuration. layer.paint Object Layer paint configuration. layerPosition string Position of the layer: 'top', below 'labels' or below 'lines'. 
"},{"location":"3.1.Funcions_doc/#addlayerwmstiles-idlayer-options","title":"addLayerWMS(tiles, idLayer, options)","text":"
Adds a WMS layer to the map.
 
Kind: global function  
 Param Type Description tiles Array.<string> Tiles for the raster layer. idLayer string Unique identifier for the layer. options Object Options of the layer: layout, paint and layerPosition. 
"},{"location":"3.1.Funcions_doc/#addlogooptions","title":"addLogo(options)","text":"
Adds a logo to the map.
 
Kind: global function  
 Param Type Description options Object Options for the logo to add. options.id string Unique identifier for the logo. options.url string URL of the logo image. options.href string URL to navigate to when the logo is clicked. options.height string Height of the logo. 
"},{"location":"3.1.Funcions_doc/#addbasemapsicgcbasesarray","title":"addBasemapsICGC(basesArray)","text":"
Adds base layers to the map.
 
Kind: global function  
 Param Type Description basesArray Array.<Object> Array of base layer objects. 
"},{"location":"3.1.Funcions_doc/#addbasemapsbaselayers","title":"addBasemaps(baseLayers)","text":"
Adds base layers to the map.
 
Kind: global function  
 Param Type Description baseLayers Array.<Object> Array of base layer objects. baseLayers.label string Label for the base layer. baseLayers.image string URL of the image representing the base layer. baseLayers.url string URL of the base layer style. 
"},{"location":"3.1.Funcions_doc/#addfeaturequeryidlayer-queryfields-popupstyle","title":"addFeatureQuery(idLayer, queryFields, popupStyle)","text":"
Adds feature query function to a layer.
 
Kind: global function  
 Param Type Description idLayer string name of the layer queryFields objetc optional indications for the popup popupStyle objetc optional indications for the popup style 
"},{"location":"3.1.Funcions_doc/#addscalecontroloptions-position","title":"addScaleControl(options, position)","text":"
Adds a scale control to the map.  * @function addScaleControl
 
Kind: global function  
 Param Type Description options Object Options for configuring the scale control. position string The position on the map to place the scale control (e.g., 'top-left', 'bottom-right'). 
"},{"location":"3.1.Funcions_doc/#addexportcontroloptions-position","title":"addExportControl(options, [position])","text":"
Adds an export control to the map with the provided options and position.
 
Kind: global function  
 Param Type Description options Object | string Options for the export control or position if provided as a string. [position] string Position to place the export control (e.g., 'top-right'). 
"},{"location":"3.1.Funcions_doc/#addmarkeroptions-object","title":"addMarker(options) \u2192Object","text":"
Adds a marker to the map.
 
Kind: global function Returns: Object - - Instance of the added marker.  
 Param Type Description options Object Options for the marker to add. options.text string Text content for the marker popup. options.options Object Marker options. options.coord LngLatLike Coordinates for placing the marker. options.textOffset Object Text offset for the marker popup. 
"},{"location":"3.1.Funcions_doc/#addpopupoptions-coord-text-popupstyle-object","title":"addPopup(options, coord, text, popupStyle) \u2192Object","text":"
Adds a popup to the map.
 
Kind: global function Returns: Object - - Instance of the added popup.  
 Param Type Description options Object Options for the popup to add. coord LngLatLike Coordinates for placing the popup. text string HTML content for the popup. popupStyle string css content for the popup style. 
"},{"location":"3.1.Funcions_doc/#addfullscreenposition","title":"addFullScreen([position])","text":"
Adds a fullscreen control to the map.
 
Kind: global function  
 Param Type Default Description [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addmenuitemname","title":"addMenuItem(name)","text":"
Adds a menu item with a checkbox for controlling the visibility of a layer on the map.
 
Kind: global function  
 Param Type Description name string The name of the layer corresponding to the menu item. 
"},{"location":"3.1.Funcions_doc/#addlayertreeoptions","title":"addLayerTree(options)","text":"
Adds a layer tree to the map.
 
Kind: global function  
 Param Type Description options Object Options for the layer tree to add. options.features Object Features for the layer tree. options.id string Unique identifier for the layer tree. options.type string Type of layer tree ('geojson', 'raster', etc.). 
"},{"location":"3.1.Funcions_doc/#createnavigationcontroloptions-position-object","title":"createNavigationControl(options, [position]) \u2192Object","text":"
Creates a navigation control with the provided options.
 
Kind: global function Returns: Object - - Instance of the created navigation control.  
 Param Type Default Description options Object Options for the navigation control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addnavigationcontroloptions-position","title":"addNavigationControl(options, [position])","text":"
Adds a navigation control to the map with the provided options.
 
Kind: global function  
 Param Type Default Description options Object Options for the navigation control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addattributioncontroloptions-position","title":"addAttributionControl(options, [position])","text":"
Adds an attribution control to the map with the provided options.
 
Kind: global function  
 Param Type Default Description options Object Options for the attribution control. [position] string \"'bottom-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addimagelayericgcurl-idlayer-options","title":"addImageLayerICGC(url, idLayer, options)","text":"
Adds an ICGC image layer to the map based on the specified name and year.
 
Kind: global function  
 Param Type Description url string The url of the  layer. idLayer string The user id for the  layer. options object Type, position,layout and paint options for the layer 
"},{"location":"3.1.Funcions_doc/#addvectorlayericgcurl-idlayer-options","title":"addVectorLayerICGC(url, idLayer, options)","text":"
Adds an ICGC vector layer to the map based on the specified name and year.
 
Kind: global function  
 Param Type Description url string The url of the vector layer. idLayer string The user id for the vector layer. options object Type, position,layout and paint options for the layer 
"},{"location":"3.1.Funcions_doc/#addfgblayericgcurl-idlayer-options","title":"addFGBLayerICGC(url, idLayer, options)","text":"
Adds an ICGC FGB layer to the map based on the specified name and year.
 
Kind: global function  
 Param Type Description url string The url of the FGB layer. idLayer string Id for the layer. options object Paint option for the layer 
"},{"location":"3.1.Funcions_doc/#addterrainicgcurl-controlposition","title":"addTerrainICGC(url, controlPosition)","text":"
Adds 3D terrain to the map using hillshade.
 
Kind: global function  
 Param Type Description url string dataset url of the terrain controlPosition string Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addlegendurl-idlayer","title":"addLegend(url, idLayer)","text":"
Add image legend.
 
Kind: global function  
 Param Type Description url string image legend url. idLayer string layer's name. 
"},{"location":"3.1.Funcions_doc/#_findimagetypeurl-var1-var2-var3-var4-string-null","title":"_findImageType(url, var1, var2, var3, var4) \u2192string | null","text":"
Finds the type of image based on the provided URL and specified vectors.
 
Kind: global function Returns: string | null - - The type of image if found, otherwise null.  
 Param Type Description url string The URL of the image to find the type for. var1 Object The first vector object containing key-value pairs. var2 Object The second vector object containing key-value pairs. var3 Object The third vector object containing key-value pairs. var4 Object The fourth vector object containing key-value pairs. 
"},{"location":"3.1.Funcions_doc/#_getkeybyurlfgburl-string-null","title":"_getKeyByUrlFGB(url) \u2192string | null","text":"
Gets the key by URL from the FGBAdmin layers.
 
Kind: global function Returns: string | null - - The key if found, otherwise null.  
 Param Type Description url string The URL to find the key for in the FGBAdmin layers. 
"},{"location":"3.1.Funcions_doc/#_getlegendbynamename-string-null","title":"_getLegendByName(name) \u2192string | null","text":"
Gets the legend by name from the default vector layers.
 
Kind: global function Returns: string | null - - The legend if found, otherwise null.  
 Param Type Description name string The name of the vector layer to get the legend for. 
"},{"location":"3.1.Funcions_doc/#_getkeybyurlvectorurl-string-null","title":"_getKeyByUrlVector(url) \u2192string | null","text":"
Gets the key by URL from the Vector layers.
 
Kind: global function Returns: string | null - - The key if found, otherwise null.  
 Param Type Description url string The URL to find the key for in the Vector layers. 
"},{"location":"3.1.Funcions_doc/#_raisetext3dstyle-promisevoid","title":"_raiseText3DStyle() \u2192Promise.<void>","text":"
Raises text 3D style on the map.
 
Kind: global function Returns: Promise.<void> - - A promise that resolves after updating the text 3D style on the map. 
"},{"location":"3.1.Funcions_doc/#_dealstylemapsname-object-string-null","title":"_dealStyleMaps(name) \u2192Object | string | null","text":"
Deals with map styles based on the name.
 
Kind: global function Returns: Object | string | null - - The map style object if found, or the input name if not found, or null if an error occurs.  
 Param Type Description name string The name of the map style. 
"},{"location":"3.1.Funcions_doc/#_dealorto3dstylename-void-null","title":"_dealOrto3dStyle(name) \u2192void | null","text":"
Deals with the 3D ortho style based on the name.
 
Kind: global function Returns: void | null - - Returns null if an error occurs.  
 Param Type Description name string The name of the orto3D style. 
"},{"location":"3.1.Funcions_doc/#_dealorderlayerorder-string","title":"_dealOrderLayer(order) \u2192string","text":"
Deals with the order of the layer.
 
Kind: global function Returns: string - - The id of the first symbol layer if the order is 'symbol', the id of the first line layer if the order is 'line', otherwise an empty string.  
 Param Type Description order string The order of the layer. 
"},{"location":"3.1.Funcions_doc/#_firstsymbollayer-string-undefined","title":"_firstSymbolLayer() \u2192string | undefined","text":"
Retrieves the id of the first symbol layer.
 
Kind: global function Returns: string | undefined - - The id of the first symbol layer if found, otherwise undefined. 
"},{"location":"3.1.Funcions_doc/#_firstlinelayer-string-undefined","title":"_firstLineLayer() \u2192string | undefined","text":"
Retrieves the id of the first line layer.
 
Kind: global function Returns: string | undefined - - The id of the first line layer if found, otherwise undefined. 
"},{"location":"3.1.Funcions_doc/#_createcitiesmapboxlayer-mapboxlayer-null","title":"_createCitiesMapboxLayer() \u2192MapboxLayer | null","text":"
Creates a Mapbox layer for displaying cities in 3D.
 
Kind: global function Returns: MapboxLayer | null - - The Mapbox layer for displaying cities in 3D if created successfully, otherwise null.  
"},{"location":"4.1.Versio/","title":"4.1.Versio","text":""},{"location":"4.1.Versio/#versionat","title":"Versionat","text":"
v. 1.0.0 
"}]}
\ No newline at end of file
+{"config":{"lang":["en"],"separator":"[\\s\\-]+","pipeline":["stopWordFilter"]},"docs":[{"location":"","title":"MapICGC-gl-js","text":"
La biblioteca MapICGC GL JS, creada com a envoltori de MapLibreGL, ofereix noves funcions espec\u00edfiques en un entorn ICGC. Simplifica el desenvolupament integrant caracter\u00edstiques com tessel\u00b7les vectorials i imatges satel\u00b7litals, i incorpora de manera inmediata estils, terrenys i dades ICGC.  Proporciona funcions documentades per a la creaci\u00f3 d'un visor complet i totalment personalitzable.
"},{"location":"#que-es","title":"Qu\u00e8 \u00e9s?","text":"
La biblioteca MapICGC GL JS, basada en Maplibre GL, \u00e9s una eina desenvolupada per l'Institut Cartogr\u00e0fic i Geol\u00f2gic de Catalunya (ICGC) per millorar la cartografia web i proporcionar una soluci\u00f3 integrada als desenvolupadors. Permet accedir f\u00e0cilment a dades geoespacials de l'ICGC, com ara tessel\u00b7les vectorials, imatges satel\u00b7litals i models d'elevaci\u00f3 del terreny, facilitant la creaci\u00f3 de visors web personalitzats. A m\u00e9s, ofereix funcions per a la gesti\u00f3 de dades en temps d'execuci\u00f3, com geocodificaci\u00f3 i geolocalitzaci\u00f3, i el seu disseny modular permet la seva aplicaci\u00f3 en una \u00e0mplia gamma de projectes de cartografia i gesti\u00f3 de recursos.
"},{"location":"#com-funciona","title":"Com funciona?","text":"
La biblioteca MapICGC GL JS funciona integrant funcionalitats de Maplibre GL i proporcionant acc\u00e9s a dades geoespacials de l'Institut Cartogr\u00e0fic i Geol\u00f2gic de Catalunya (ICGC). Per integrar-ho al teu projecte, nom\u00e8s cal instal\u00b7lar la biblioteca mitjan\u00e7ant NPM o integrar-la a trav\u00e9s de CDN. Gran part del codi Maplibre/Mapbox es compatible amb la biblioteca MapICGC GL JS.
"},{"location":"#installacio","title":"Instal\u00b7laci\u00f3","text":"
     
  • 1.1 Instal\u00b7laci\u00f3 via NPM
    •  
  • 1.2 Instal\u00b7laci\u00f3 via CDN
    •  
"},{"location":"#exemples","title":"Exemples","text":"
     
  • 2.1 Crear mapa i afegir estil
    •  
  • 2.2 Afegir terreny
    •  
  • 2.3 Afegir estil ORTO3D
    •  
  • 2.4 Afegir control d'estil
    •  
  • 2.5 Afegir capa d'imatge ICGC
    •  
  • 2.6 Afegir capa vector ICGC
    •  
  • 2.7 Afegir capa GeoJSON
    •  
  • 2.8 Afegir llistat de capes
    •  
  • 2.9 Afegir marcador
    •  
  • 2.10 Afegir control
    •  
  • 2.11 Afegir comparador
    •  
  • 2.12 Afegir logo
    •  
  • 2.13 Fetch dades
    •  
  • 2.14 Fetch dades i crea men\u00fa
    •  
  • 2.15 Consulta d'elements
    •  
  • 2.16 Afegir geocodificador ICGC
    •  
  • 2.17 Exemple visor
    •  
  • 2.18 Reutilitzaci\u00f3 codi Maplibre
    •  
"},{"location":"#documentacio","title":"Documentaci\u00f3","text":"
     
  • 3.1 Funcions
    •  
"},{"location":"#templates","title":"Templates","text":"
     
  • Svelte
    •  
  • React
    •  
  • Vanilla JS
    •  
"},{"location":"#llicencia","title":"Llic\u00e8ncia","text":"
     
  • BSD-3-Clause license
    •  
"},{"location":"#versionat","title":"Versionat","text":"
     
  • Versi\u00f3 1.0.0
    •  
"},{"location":"#autor-i-contacte","title":"Autor i contacte","text":"
Unitat Geostart, Institut Cartogr\u00e0fic i Geol\u00f2gic de Catalunya.
 
"},{"location":"1.1.Inst_npm/","title":"1.1 Instal\u00b7laci\u00f3 via NPM","text":""},{"location":"1.1.Inst_npm/#installacio-amb-npm","title":"Instal\u00b7laci\u00f3 amb NPM","text":"
Si utilitzes npm (Node Package Manager) per gestionar les depend\u00e8ncies del teu projecte, segueix aquests passos:
 
1.Obre la teva terminal i navega fins al directori del teu projecte.
 
2.Executa la seg\u00fcent comanda per instal\u00b7lar mapicgc-gl-js:
 
npm install mapicgc-gl-js\n
 
Aix\u00f2 descarregar\u00e0 i instal\u00b7lar\u00e0 la biblioteca al teu projecte.
 
3.Un cop completada la instal\u00b7laci\u00f3, pots importar la biblioteca al teu codi:
 
 const biblioteca = require('mapicgc-gl-js'); //ES6\n
 
o
 
 import { Map, Config } from \"mapicgc-gl-js\";\n
 
Ara est\u00e0s llest per comen\u00e7ar a utilitzar mapicgc-gl-js, seguint l'exemple seg\u00fcent:
 
<script>\n  import { Map, Config } from \"mapicgc-gl-js\";\n  import \"../node_modules/mapicgc-gl-js/dist/mapicgc-gl.css\";\n\n  async function initMap() {\n    const data = await Config.getConfigICGC();\n    const map = new Map({\n      container: \"map\",\n      style: data.Styles.TOPO,\n      center: [2.1464, 41.306],\n      zoom: 7.4,\n      maxZoom: 14,\n      hash: true,\n      pitch: 0,\n    });\n  }\n  initMap();\n</script> \n
"},{"location":"1.2.Inst_cdn/","title":"1.2 Instal\u00b7laci\u00f3 via CDN","text":""},{"location":"1.2.Inst_cdn/#installacio-amb-cdn","title":"Instal\u00b7laci\u00f3 amb CDN","text":"
Si prefereixes utilitzar un CDN per incorporar la biblioteca al teu projecte, pots seguir aquests passos:
 
1.Obre la teva terminal i navega fins al directori del teu projecte.
 
2.Afegir la l\u00ednia seg\u00fcent al teu fitxer HTML, generalment col\u00b7locada dins la secci\u00f3 <head>:
 
<script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n\n<link href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\" rel=\"stylesheet\" />\n
 
Aix\u00f2 carregar\u00e0 la biblioteca directament des del CDN. Ara est\u00e0s llest per utilitzar mapicgc-gl-js al teu projecte seguint l'exemple seg\u00fcent:
 
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple biblioteca mapicgc-gl-js</title>\n    <meta name=\"viewport\" content=\"initial-scale=1,maximum-scale=1,user-scalable=no\" />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\" rel=\"stylesheet\"/>\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
 
 See the Pen    example-map-001 by unitatgeostart (@unitatgeostart)   on CodePen. 
"},{"location":"2.1.0.Map/","title":"2.1 Crear mapa i afegir estil","text":""},{"location":"2.1.0.Map/#exemple","title":"Exemple","text":"
.Map(options) \u2192 mateixes opcions que a MapLibreGLJS
 
 See the Pen    example Map by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.1.0.Map/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Mapa</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 14,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.1.0.Map/#estils-icgc","title":"Estils ICGC","text":""},{"location":"2.1.0.Map/#stylesid","title":"Styles.{id}","text":"id Mostra TOPO ORTO ORTO3D (versi\u00f3 experimental) ORTOHYBRID ADMIN DARK LIGHT GEOLOGY"},{"location":"2.1.2.AddICGCTerrain/","title":"2.2 Afegir terreny","text":""},{"location":"2.1.2.AddICGCTerrain/#exemple","title":"Exemple","text":"
.addTerrainICGC(resolution, position)
 
 See the Pen    addTerrainICGC by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.1.2.AddICGCTerrain/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir 3D de l'ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.ORTO,\n          center: [0.959, 42.201],\n          zoom: 13,\n          maxZoom: 14,\n          hash: true,\n          pitch: 80,\n          bearing: 40,\n        });\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n          map.addTerrainICGC(data.Terrains.ICGC5M, \"bottom-right\");\n          map.setSky()\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.1.2.AddICGCTerrain/#terrenys-icgc","title":"Terrenys ICGC","text":""},{"location":"2.1.2.AddICGCTerrain/#terrainsid","title":"Terrains.{id}","text":"id Resoluci\u00f3 / Extensi\u00f3 ICGC5M 5m / Catalunya WORLD30M 30m / World"},{"location":"2.1.3.3dStyle/","title":"2.3 Afegir estil ORTO3D","text":""},{"location":"2.1.3.3dStyle/#exemple","title":"Exemple","text":"
.Map({style: mapicgcgl.Styles.ORTO3D})
 
 See the Pen    example Map 3D by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.1.3.3dStyle/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: estil ORTO3D</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.ORTO3D,\n          center: [2.309, 41.98],\n          zoom: 18,\n          maxZoom: 19,\n          hash: true,\n          bearing: 45,\n        });\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.1.3.3dStyle/#estils-icgc","title":"Estils ICGC","text":""},{"location":"2.1.3.3dStyle/#stylesid","title":"Styles.{id}","text":"id Mostra TOPO ORTO ORTO3D (versi\u00f3 experimental) ORTOHYBRID ADMIN DARK LIGHT GEOLOGY"},{"location":"2.10.AddLogo/","title":"2.12 Afegir logo","text":""},{"location":"2.10.AddLogo/#exemple","title":"Exemple","text":"
.addLogo(options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.10.AddLogo/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir logo</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      #logos {\n        display: flex;\n        flex-direction: row;\n        bottom: 40%;\n        position: absolute;\n        right: 50%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        let options = {\n          id: \"icgcColorLogo\",\n          url: \"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/images/grumpyCatTest.png\",\n          href: \"https://www.icgc.cat\",\n          height: \"100px\",\n        };\n        map.on(\"load\", () => {\n          map.addFullscreenControl();\n          map.addLogo(options); //pots canviar la posici\u00f3 del/s logo/s al css\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.11.FetchData/","title":"2.13 Fetch dades","text":""},{"location":"2.11.FetchData/#exemple","title":"Exemple","text":"
.fetchData(url,idLayer,options)
 
\ud83d\udccc Format de dades: geojson o flatgeobuf
 
 See the Pen    Exemple fetchData by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.11.FetchData/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Fetch dades</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.LIGHT,\n          center: [1.808, 41.618],\n          zoom: 10,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        let paintOptions = {\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"green\",\n            \"line-width\": 3,\n            \"line-opacity\": 1,\n          },\n          layerPosition: \"top\", // select: 'top', 'lines' or 'labels'\n        };\n        let paintOptionsfgb = {\n          type: \"line\",\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"grey\",\n            \"line-width\": 2,\n          },\n          layerPosition: \"top\", // select: 'top', 'lines' or 'labels'\n        };\n\n        map.on(\"load\", () => {\n          map.fetchData(\n            data.Layers.FGBAdmin.comarquesVigent,\n            \"Comarques\",\n            paintOptionsfgb\n          );\n\n          map.fetchData(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            paintOptions\n          );\n          // try with FGB data:\n\n          // map.fetchData(\n          //     \"https://flatgeobuf.org/test/data/UScounties.fgb\",\n          //     \"UScounties\", paintOptionsfgb\n          // );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.11.FetchData/#posicio-layerposition","title":"Posici\u00f3 (layerPosition)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.11.FetchData/#capes-fgb-icgc","title":"Capes FGB ICGC","text":""},{"location":"2.11.FetchData/#layersfgbadminid","title":"Layers.FGBAdmin.{id}","text":"id agrupacionsCensalsVigent agrupacionsCensalsVigentText areesBasiquesPolicialsVigent areesBasiquesPolicialsVigentText areesBasiquesServeisSocialsVigent areesBasiquesServeisSocialsVigentText areesGestioAssistencialVigent areesHidrogeologiquesAquifersVigent catalunyaVigent catalunyaVigentText comarquesVigent comarquesVigentText districtesCensalsVigent districtesCensalsVigentText incendisForestalsVigent incendisForestalsVigentText municipisVigent municipisVigentText partitsJudicialsVigent partitsJudicialsVigentText plaTerritorialVigent plaTerritorialVigentText provinciesVigent provinciesVigentText regionsPolicialsVigent regionsPolicialsVigentText regionsSanitariesVigent regionsSanitariesVigentText seccionsCensalsVigent seccionsCensalsVigentText sectorsSanitarisVigent vegueriesVigent vegueriesVigentText"},{"location":"2.12.FetchDataAndMenu/","title":"2.14 Fetch dades i crea men\u00fa","text":""},{"location":"2.12.FetchDataAndMenu/#exemple","title":"Exemple","text":"
.fetchDataAndMenu(url,idLayer,filterField,options)
 
\ud83d\udccc Format de dades: geojson o flatgeobuf
 
 See the Pen    Exemple fetchData by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.12.FetchDataAndMenu/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Fetch dades</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n\n      /* Personalitza el teu men\u00fa: */\n\n      #menu-group {\n        position: absolute;\n        top: 10px;\n        left: 10px;\n        color: #000000;\n      }\n\n      #menu-group input[type=\"checkbox\"] + label {\n        background-color: #ffffff !important;\n      }\n\n      #titleDivMenu {\n        background-color: rgb(213 212 212);\n      }\n\n      #titleDivMenuSub {\n        background-color: #e9e9e9;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [1.808, 41.618],\n          zoom: 10,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        let filterField = \"municipi\"; // select 'all' for view all the features as a single layer\n        let optionsLayer = {\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"green\",\n            \"line-width\": 3,\n            \"line-opacity\": 1,\n          },\n          layerPosition: \"labels\",\n        };\n\n        let filterFGBField = \"NOMPROV\"; // select 'all' for view all the features as a single layer\n        let optionsLayerfgb = {\n          type: \"line\",\n          layout: {\n            visibility: \"visible\",\n          },\n          paint: {\n            \"line-color\": \"grey\",\n            \"line-opacity\": 1,\n            \"line-width\": 2,\n          },\n          layerPosition: \"labels\",\n        };\n\n        map.on(\"load\", () => {\n          map.fetchDataAndMenu(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            filterField,\n            optionsLayer\n          );\n\n          //     map.fetchDataAndMenu(\n          //     \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n          //     \"RutesMontserrat\", filterField, layerPosition, paintOptions);\n\n          // map.fetchDataAndMenu(\n          //     data.Layers.FGBAdmin.provinciesVigent, \"Provincies\",\n          //     filterFGBField, layerPosition, paintOptionsfgb\n          // );\n          map.fetchDataAndMenu(\n            data.Layers.FGBAdmin.provinciesVigent,\n            \"Provincies\",\n            filterFGBField,\n            optionsLayerfgb\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.12.FetchDataAndMenu/#posicio-layerposition","title":"Posici\u00f3 (layerPosition)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.12.FetchDataAndMenu/#capes-fgb-icgc","title":"Capes FGB ICGC","text":""},{"location":"2.12.FetchDataAndMenu/#layersfgbadminid","title":"Layers.FGBAdmin.{id}","text":"id agrupacionsCensalsVigent agrupacionsCensalsVigentText areesBasiquesPolicialsVigent areesBasiquesPolicialsVigentText areesBasiquesServeisSocialsVigent areesBasiquesServeisSocialsVigentText areesGestioAssistencialVigent areesHidrogeologiquesAquifersVigent catalunyaVigent catalunyaVigentText comarquesVigent comarquesVigentText districtesCensalsVigent districtesCensalsVigentText incendisForestalsVigent incendisForestalsVigentText municipisVigent municipisVigentText partitsJudicialsVigent partitsJudicialsVigentText plaTerritorialVigent plaTerritorialVigentText provinciesVigent provinciesVigentText regionsPolicialsVigent regionsPolicialsVigentText regionsSanitariesVigent regionsSanitariesVigentText seccionsCensalsVigent seccionsCensalsVigentText sectorsSanitarisVigent vegueriesVigent vegueriesVigentText"},{"location":"2.13.AddFeatureQuery/","title":"2.15 Consulta d'elements","text":""},{"location":"2.13.AddFeatureQuery/#exemple","title":"Exemple","text":"
.addFeatureQuery(layer, queryFields, popupStyle)
 
Retorna informaci\u00f3 al fer clic sobre un element
 
 See the Pen    Exemple Consulta d'elements by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.13.AddFeatureQuery/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Consulta d'elements</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          let paintOptions = {\n            layout: { visibility: \"visible\" },\n            paint: {\n              \"line-color\": \"red\",\n              \"line-width\": 2,\n              \"line-opacity\": 1,\n            },\n            layerPosition: \"top\",\n          };\n\n          map.fetchData(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            paintOptions\n          );\n\n          let popupStyle = {\n            title: \"Informaci\u00f3:\",\n            image: \"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/logos/icgc_logo_color.png\",\n          };\n          // si volem camps espec\u00edfics:\n          // let queryFields = [\"nom\", \"municipi\"];\n          let queryFields = [];\n          map.addFeatureQuery(\"RutesMontserrat\", queryFields, popupStyle);\n\n          //si volem tots els par\u00e0metres:\n          // map.addFeatureQuery(\"RutesMontserrat\");\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.14.AddGeocoderICGC/","title":"2.16 Afegir geocodificador ICGC","text":""},{"location":"2.14.AddGeocoderICGC/#exemple","title":"Exemple","text":"
.addGeocoderICGC()
 
 See the Pen    Exemple geocodificador by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.14.AddGeocoderICGC/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Geocodificador</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [1.8436, 41.5923],\n          zoom: 11,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          map.addGeocoderICGC();\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.2.AddBasemap/","title":"2.4 Afegir control d'estil","text":""},{"location":"2.2.AddBasemap/#exemple","title":"Exemple","text":"
.addBasemapsICGC(baseLayers)
 
 See the Pen    addBasemapsICGC by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.2.AddBasemap/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir mapa base ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n\n      #basemap-group {\n        position: absolute;\n        bottom: 40px;\n        right: 10px;\n        color: #000000;\n        display: flex;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO, // <-- add style basemap here\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 14,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          //add multiple ICGC basemaps and get a style menu component\n          map.addFullscreenControl();\n          let basemapsicgc = [data.Styles.ORTO, data.Styles.TOPO];\n          map.addBasemapsICGC(basemapsicgc);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.20.AdvancedExample/","title":"2.17 Exemple visor","text":""},{"location":"2.20.AdvancedExample/#exemple","title":"Exemple","text":"
 See the Pen    Exemple  by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.20.AdvancedExample/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple avan\u00e7at mapicgc-gl-js</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      /*personalitza el teu men\u00fa */\n      #menu-group {\n        position: absolute;\n        top: 10px;\n        left: 10px;\n        color: #000000;\n      }\n\n      #menu-group input[type=\"checkbox\"] + label {\n        background-color: #ffffff !important;\n      }\n\n      #titleDivMenu {\n        background-color: rgb(213 212 212);\n      }\n\n      #titleDivMenuSub {\n        background-color: #e9e9e9;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.DARK,\n          center: [1.808, 41.618],\n          zoom: 10,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        map.on(\"load\", () => {\n          map.addGeocoderICGC();\n          map.addGeolocateControl(\n            {\n              positionOptions: {\n                enableHighAccuracy: true,\n              },\n              trackUserLocation: true,\n            },\n            \"bottom-right\"\n          );\n          map.addFullscreenControl();\n          map.addExportControl();\n\n          map.addTerrainICGC(data.Terrains.ICGC5M, \"bottom-right\");\n          let optionsLayer = {\n            type: \"raster\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"raster-opacity\": 1,\n            },\n            position: \"labels\",\n          };\n\n          // map.addImageLayerICGC(\"orto2013\",mapicgcgl.Layers.Orto.ortofotoColor2013, optionsLayer);\n\n          //add vector icgc\n          let optionsLayerVector = {\n            type: \"line\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"line-color\": \"red\",\n              \"line-width\": 0.2,\n            },\n            position: \"lines\",\n          };\n\n          map.addVectorLayerICGC(\n            \"Municipis\", //ID\n            data.Layers.VectorAdmin.municipisVigent, //Layer\n            optionsLayerVector //options\n          );\n\n          let paintOptions = {\n            \"point-color\": \"yellow\",\n            \"point-width\": 3,\n          };\n          let layerPosition = \"top\"; // select: 'top', 'lines' or 'labels'\n          let filterFieldRutes = \"municipi\"; // select 'all' for view all the features as a single layer\n          let optionsLayerRutes = {\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"line-color\": \"white\",\n              \"line-width\": 3,\n              \"line-opacity\": 1,\n            },\n            layerPosition: \"labels\",\n          };\n\n          map.fetchDataAndMenu(\n            \"https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson\",\n            \"RutesMontserrat\",\n            filterFieldRutes,\n            optionsLayerRutes\n          );\n\n          let popupStyle = {\n            title: \"Informaci\u00f3:\",\n            image: \"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/logos/gencat_logo_color.png\",\n          };\n          let queryFields = [\"nom\", \"municipi\"]; // [] for query all the properties\n          map.addFeatureQuery(\"RutesMontserrat\", queryFields, popupStyle);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.21.Maplibre2Mapicgc/","title":"2.18 Reutilitzaci\u00f3 codi Maplibre","text":""},{"location":"2.21.Maplibre2Mapicgc/#exemple","title":"Exemple","text":"
Exemple de reutilitzaci\u00f3 d'un codi Maplibre a MapICGC GL JS. Les dades utilitzades provenen de Dades Obertes i representen les explotacions agr\u00edcoles de Catalunya a la campanya 2023 gestionades per dones nascudes despr\u00e9s del 1990.
 
 See the Pen    Exemple  by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.21.Maplibre2Mapicgc/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Reutilitzaci\u00f3 codi Maplibre</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n\n     // const map = new maplibregl.Map({  \n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO, // o url directe: 'https://geoserveis.icgc.cat/contextmaps/icgc_mapa_base_gris.json'\n          center: [1.1437, 42.4293],\n          zoom: 12,\n        });\n\n        map.on(\"load\", () => {\n\n       // map.addControl(new maplibregl.NavigationControl());\n          map.addNavigationControl();\n\n       // let scale = new maplibregl.ScaleControl({\n       //     maxWidth: 80,\n       //     unit: 'metric'\n       // });\n       // map.addControl(scale);\n          map.addScaleControl(\n            { maxWidth: 100, unit: \"metric\" },\n            \"bottom-right\"\n          );\n\n          const layers = map.getStyle().layers;\n\n          let firstSymbolId;\n          for (let i = 0; i < layers.length; i++) {\n            if (layers[i].type === \"symbol\") {\n              firstSymbolId = layers[i].id;\n              break;\n            }\n          }\n          map.addSource(\"areas\", {\n            type: \"geojson\",\n            data: \"https://analisi.transparenciacatalunya.cat/resource/iqpi-zasj.geojson?$query=SELECT%0A%20%20%60the_geom%60%2C%0A%20%20%60campanya%60%2C%0A%20%20%60oc%60%2C%0A%20%20%60nom_oc%60%2C%0A%20%20%60ajuts%60%2C%0A%20%20%60codi_pro%60%2C%0A%20%20%60nom_pro%60%2C%0A%20%20%60c_mun_ine%60%2C%0A%20%20%60n_mun_ine%60%2C%0A%20%20%60naturalesa%60%2C%0A%20%20%60data_naix%60%2C%0A%20%20%60ote%60%2C%0A%20%20%60opfh%60%2C%0A%20%20%60codi_dop%60%2C%0A%20%20%60venda_prox%60%2C%0A%20%20%60eap%60%2C%0A%20%20%60id_exp%60%2C%0A%20%20%60ha_dec%60%0AWHERE%0A%20%20caseless_one_of(%60campanya%60%2C%20%222023%22)%0A%20%20AND%20(caseless_one_of(%60naturalesa%60%2C%20%22PF%20Dona%22)%0A%20%20%20%20%20%20%20%20%20AND%20(%60data_naix%60%20%3E%20%221990%22))\",\n          });\n          map.addLayer(\n            {\n              id: \"agric23Dones1990\",\n              type: \"fill\",\n              source: \"areas\",\n              layout: {},\n              paint: {\n                \"fill-color\": \"#f08\",\n                \"fill-opacity\": 0.4,\n              },\n            },\n            firstSymbolId\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.3.AddImageLayerICGC/","title":"2.5 Afegir capa d'imatge ICGC","text":""},{"location":"2.3.AddImageLayerICGC/#exemple","title":"Exemple","text":"
.addImageLayerICGC(url,idLayer,options)
 
 See the Pen    Exemple addImageLayerICGC by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.3.AddImageLayerICGC/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir capa imatge ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 14,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          let optionsLayer = {\n            type: \"raster\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"raster-opacity\": 1,\n            },\n            layerPosition: \"top\",\n          };\n          map.addImageLayerICGC(\n            data.Layers.Orto.ortofotoColor2013,\n            \"orto2013\",\n            optionsLayer\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.3.AddImageLayerICGC/#posicio-layerposition","title":"Posici\u00f3 (layerPosition)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.3.AddImageLayerICGC/#capes-dimatge-icgc","title":"Capes d'imatge ICGC","text":""},{"location":"2.3.AddImageLayerICGC/#layersortoid","title":"Layers.Orto.{id}","text":"id ortofotoColorProvisional ortofotoColor2023 ortofotoColor2022 ortofotoColor2021 ortofotoColor2020 ortofotoColor2019 ortofotoColor2018 ortofotoColor2017 ortofotoColor2016 ortofotoColor2015 ortofotoColor2014 ortofotoColor2013 ortofotoColor2012 ortofotoColor2011 ortofotoColor2010 ortofotoColor2009 ortofotoColor2008 ortofotoColor20062007 ortofotoColor20042005 ortofotoColor20002003 ortofotoBlancINegre1998 ortofotoBlancINegre19941997 ortofotoColor1993 ortofotoBlancINegre19831992 ortofotoBlancINegre19701977 ortofotoBlancINegre1956 ortofotoBlancINegre1945 ortofotoColorSerieAnual ortofotoInfraroigProvisional ortofotoInfraroig2023 ortofotoInfraroig2022 ortofotoInfraroig2021 ortofotoInfraroig2020 ortofotoInfraroig2019 ortofotoInfraroig2018 ortofotoInfraroig2017 ortofotoInfraroig2016 ortofotoInfraroig2015 ortofotoInfraroig2014 ortofotoInfraroig2013 ortofotoInfraroig2012 ortofotoInfraroig2011 ortofotoInfraroig2010 ortofotoInfraroig2009 ortofotoInfraroig2008 ortofotoInfraroig20062007 ortofotoInfraroig19961997 ortofotoInfraroigSerieAnual"},{"location":"2.3.AddImageLayerICGC/#layerswmsid","title":"Layers.WMS.{id}","text":"id espaisInteresGeologic gravimetriaBouguer500000 cobertesSol2018 administratiu simplificat cims"},{"location":"2.4.AddVectorLayerICGC/","title":"2.6 Afegir capa vector ICGC","text":""},{"location":"2.4.AddVectorLayerICGC/#exemple","title":"Exemple","text":"
.addVectorLayerICGC(url,idLayer,options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.4.AddVectorLayerICGC/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir capa vector de l'ICGC</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      /* personalitza el teu bot\u00f3 de llegenda: */\n      #toggleLegend {\n        position: absolute;\n        top: 20px;\n        right: 20px;\n        background-color: #3f33eb;\n        color: white;\n        width: 40px;\n        height: 40px;\n        border-radius: 50%;\n        text-align: center;\n        line-height: 40px;\n        cursor: pointer;\n        z-index: 1000;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n          let optionsVectorAdmin = {\n            type: \"line\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"line-color\": \"#4832a8\",\n              \"line-opacity\": 1,\n              \"line-width\": 1,\n            },\n            layerPosition: \"top\",\n          };\n\n          let optionsVector = {\n            type: \"fill\",\n            layout: {\n              visibility: \"visible\",\n            },\n            paint: {\n              \"fill-color\": \"red\",\n            },\n            layerPosition: \"top\",\n          };\n          map.addVectorLayerICGC(\n            data.Layers.Vector.cobertes2018,\n            \"Cobertes\",\n            optionsVector\n          );\n          map.addVectorLayerICGC(\n            data.Layers.VectorAdmin.municipisVigent,\n            \"municipisVigent\",\n            optionsVectorAdmin\n          );\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.4.AddVectorLayerICGC/#posicio-position","title":"Posici\u00f3 (position)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.4.AddVectorLayerICGC/#capes-vector-icgc","title":"Capes vector ICGC","text":""},{"location":"2.4.AddVectorLayerICGC/#layersvectoradminid","title":"Layers.VectorAdmin.{id}","text":"id agrupacionsCensals2015 agrupacionsCensals2016 agrupacionsCensals2017 agrupacionsCensals2018 agrupacionsCensals2019 agrupacionsCensals2020 agrupacionsCensals2021 agrupacionsCensalsVigent agrupacionsCensalsVigentText areesBasiquesPolicials2019 areesBasiquesPolicials2020 areesBasiquesPolicials2022 areesBasiquesPolicialsVigent areesBasiquesPolicialsVigentText areesBasiquesSalutVigent areesBasiquesServeisSocialsVigent areesBasiquesServeisSocialsVigentText areesGestioAssistencialVigent areesHidrogeologiquesAquifersVigent catalunyaVigent catalunyaVigentText comarques2022 comarquesVigent comarquesVigentText districtesCensals2015 districtesCensals2016 districtesCensals2017 districtesCensals2018 districtesCensals2019 districtesCensals2020 districtesCensals2021 districtesCensals2022 districtesCensals2023 districtesCensalsVigent districtesCensalsVigentText incendisForestalsVigent incendisForestalsVigentText municipis2022 municipis2022Text municipisVigent municipisVigentText partitsJudicialsVigent partitsJudicialsVigentText plaTerritorial2015 plaTerritorialVigent plaTerritorialVigentText provinciesVigent provinciesVigentText regionsPolicialsVigent regionsPolicialsVigentText regionsSanitariesVigent regionsSanitariesVigentText seccionsCensals2015 seccionsCensals2016 seccionsCensals2017 seccionsCensals2018 seccionsCensals2019 seccionsCensals2020 seccionsCensals2021 seccionsCensals2022 seccionsCensals2023 seccionsCensalsVigent seccionsCensalsVigentText sectorsSanitarisVigent vegueriesVigent vegueriesVigentText"},{"location":"2.4.AddVectorLayerICGC/#layersvectorid","title":"Layers.Vector.{id}","text":"id cobertes2018"},{"location":"2.5.AddLayerGeojson/","title":"2.7 Afegir capa GeoJSON","text":""},{"location":"2.5.AddLayerGeojson/#exemple","title":"Exemple","text":"
.addLayerGeoJSON(url,idLayer,options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.5.AddLayerGeojson/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir capa</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [1.001, 41.759],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        map.on(\"load\", () => {\n          let geojsonLayer = {\n            id: \"geojsonTest\",\n            data: {\n              type: \"Feature\",\n              geometry: {\n                type: \"Polygon\",\n                coordinates: [\n                  [\n                    [1.3119, 41.489],\n                    [1.0119, 41.489],\n                    [1.0119, 42.0489],\n                    [1.3119, 42.0489],\n                  ],\n                ],\n              },\n            },\n            type: \"fill\",\n            layout: {},\n            paint: {\n              \"fill-color\": \"#088\",\n              \"fill-opacity\": 0.8,\n            },\n          };\n          let layerPosition = \"labels\"; // select: 'top', 'lines' or 'labels'\n          map.addLayerGeoJSON(geojsonLayer, layerPosition);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.5.AddLayerGeojson/#posicio-position","title":"Posici\u00f3 (position)","text":"id Descripci\u00f3 'top' Posici\u00f3 de la capa per sobre de tots els elements carregats pr\u00e8viament 'labels' Posici\u00f3 de la capa per sota de tots els elements de tipus etiqueta carregats pr\u00e8viament 'lines' Posici\u00f3 de la capa per sota de tots els elements de tipus l\u00ednia, punt i etiqueta carregats pr\u00e8viament"},{"location":"2.6.AddLayerTree/","title":"2.8 Afegir llistat de capes","text":""},{"location":"2.6.AddLayerTree/#exemple","title":"Exemple","text":"
.addLayerTree(options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.6.AddLayerTree/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir arbre de capes</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <nav id=\"filter-group\" class=\"filter-group\"></nav>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 6.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        let options = {\n          features: {\n            type: \"FeatureCollection\",\n            features: [\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Rub\u00ed\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [2.0119, 41.489],\n                },\n              },\n\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Moi\u00e0\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [2.119, 41.87],\n                },\n              },\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Les Borges Blanques\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [0.97319, 41.4589],\n                },\n              },\n              {\n                type: \"Feature\",\n                properties: {\n                  icon: \"Berga\",\n                },\n                geometry: {\n                  type: \"Point\",\n                  coordinates: [1.83, 42.163],\n                },\n              },\n            ],\n          },\n          id: \"testLayer\",\n          type: \"geojson\",\n        };\n        map.on(\"load\", () => {\n          map.addLayerTree(options);\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.7.AddMarker/","title":"2.9 Afegir marker","text":""},{"location":"2.7.AddMarker/#exemple","title":"Exemple","text":"
.addmarker(options)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.7.AddMarker/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir marcador</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      .maplibregl-popup-close-button {\n        color: blue;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        let optionsMarker = {\n          coord: [2.119, 41.87],\n          text: \"Hola Test\",\n          textOffset: 25,\n          options: {color:\"#D08288\"},\n        };\n        map.on(\"load\", () => {\n          map.addMarker(optionsMarker);\n          map.addFullscreenControl({}, \"top-right\");\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.8.AddControl/","title":"2.10 Afegir control","text":""},{"location":"2.8.AddControl/#exemple","title":"Exemple","text":"
.addControl(control,position)
 
 See the Pen    Exemple AddMarker by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.8.AddControl/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir control</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <link\n      rel=\"stylesheet\"\n      href=\"https://unpkg.com/maplibre-gl@4.0.0/dist/maplibre-gl.css\"\n    />\n    <script src=\"https://unpkg.com/maplibre-gl@4.0.0/dist/maplibre-gl.js\"></script>\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"map\"></div>\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n        const map = new mapicgcgl.Map({\n          container: \"map\",\n          style: data.Styles.TOPO,\n          center: [2.1464, 41.306],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n        map.on(\"load\", () => {\n\n          map.addFullscreenControl({}, \"top-right\");\n          map.addGeolocateControl(\n            {\n              positionOptions: {\n                enableHighAccuracy: true,\n              },\n              trackUserLocation: true,\n            },\n            \"bottom-right\"\n          );\n\n          //control export amb opcions\n          // map.addExportControl(\n          //   {\n          //     PageSize: Size.A4,\n          //     PageOrientation: PageOrientation.Landscape,\n          //     Format: Format.PNG,\n          //     DPI: DPI[300],\n          //     Crosshair: true,\n          //     PrintableArea: true,\n          //   },\n          //   \"bottom-right\"\n          // );\n          //control export per defecte\n          map.addExportControl();\n\n          // control d'una biblioteca externa\n          map.addControl(new maplibregl.NavigationControl(), \"bottom-right\");\n        });\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"2.8.AddControl/#addgeolocatecontroloptions-position","title":"addGeolocateControl(options, position)","text":"
map.addGeolocateControl(); ; //default version \nmap.addGeolocateControl({\npositionOptions: { enableHighAccuracy: true }, trackUserLocation: true\n},\"bottom-right\")\n
"},{"location":"2.8.AddControl/#addexportcontroloptions-position","title":"addExportControl(options, position)","text":"
map.addExportControl() ; //default version \nmap.addExportControl({ PageSize:\nSize.A4, PageOrientation:PageOrientation.Landscape, Format: Format.PNG, DPI:\nDPI[300], Crosshair: true, PrintableArea: true, }, \"bottom-right\")\n
"},{"location":"2.8.AddControl/#addmousecoordcontroloptions-position","title":"addMouseCoordControl(options, position)","text":"
map.addMouseCoordControl(); //default version\nmap.addMouseCoordControl({width:'225px',utm:true,lonlat:true},\"bottom-left\");\n
"},{"location":"2.8.AddControl/#addfullscreencontroloptions-position","title":"addFullscreenControl(options, position)","text":"
map.addFullscreenControl(); //default version\nmap.addFullscreenControl({container: HTMLElement}, 'top-right');\n
"},{"location":"2.8.AddControl/#addscalecontroloptions-position","title":"addScaleControl(options, position)","text":"
map.addScaleControl(); //default version \nmap.addScaleControl({maxWidth: 100,\nunit: 'metric' ('imperial', 'metric' or 'nautical')}, \"top-right\");\n
"},{"location":"2.8.AddControl/#addnavigationcontroloptions-position","title":"addNavigationControl(options, position)","text":"
map.addNavigationControl(); //default version\nmap.addMouseCoordControl({showCompass: true, showZoom: true, visualizePitch:\ntrue}, \"top-right\");\n
"},{"location":"2.8.AddControl/#addattributioncontroloptions-position","title":"addAttributionControl(options, position)","text":"
map.addAttributionControl(); //default version\nmap.addAttributionControl({compact: true, customAttribution: \"your custom\nattribution\" }, \"bottom-right\");\n
"},{"location":"2.9.AddCompare/","title":"2.11 Afegir comparador","text":""},{"location":"2.9.AddCompare/#exemple","title":"Exemple","text":"
.CompareMaps(options)
 
 See the Pen    CompareMaps by unitatgeostart (@unitatgeostart)   on CodePen. 
 
CodePen
"},{"location":"2.9.AddCompare/#codi","title":"Codi","text":"
<html>\n  <head>\n    <meta charset=\"utf-8\" />\n    <title>Exemple mapicgc-gl-js: Afegir comparador</title>\n    <meta\n      name=\"viewport\"\n      content=\"initial-scale=1,maximum-scale=1,user-scalable=no\"\n    />\n    <script src=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.js\"></script>\n    <link\n      href=\"https://autogitlab.icgc.local/geostarters/icgc/recursos/-/raw/master/mapicgc-gl-js/mapicgc-gl.css\"\n      rel=\"stylesheet\"\n    />\n\n    <style>\n      body {\n        margin: 0;\n        padding: 0;\n      }\n      #map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n      .map {\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        width: 100%;\n        height: 100%;\n      }\n    </style>\n  </head>\n  <body>\n    <div id=\"comparison-container\">\n      <div id=\"before\" class=\"map\"></div>\n      <div id=\"after\" class=\"map\"></div>\n    </div>\n\n    <script>\n      async function initMap() {\n        const data = await mapicgcgl.Config.getConfigICGC();\n\n        const map1 = new mapicgcgl.Map({\n          container: \"before\",\n          style: data.Styles.ORTO,\n          center: [1.1464, 41.706],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        const map2 = new mapicgcgl.Map({\n          container: \"after\",\n          style: data.Styles.TOPO,\n          center: [1.1464, 41.706],\n          zoom: 7.4,\n          maxZoom: 19,\n          hash: true,\n          pitch: 0,\n        });\n\n        var container = \"#comparison-container\";\n\n        var map = new mapicgcgl.CompareMaps(map1, map2, container, {});\n      }\n      initMap();\n    </script>\n  </body>\n</html>\n
"},{"location":"3.1.Funcions_doc/","title":"3.1 Funcions","text":""},{"location":"3.1.Funcions_doc/#lnglatbounds","title":"LngLatBounds","text":"
LngLatBounds
 
Kind: global class 
"},{"location":"3.1.Funcions_doc/#new-lnglatboundssw-ne","title":"new LngLatBounds([sw], [ne])","text":"
Constructs a new LngLatBounds object representing a geographical bounding box.
 Param Type Description [sw] LngLatLike The southwest corner of the bounding box. Can be specified as an array of 4 numbers in the order of west, south, east, north, or an array of 2 LngLatLike representing [sw,ne]. [ne] LngLatLike The northeast corner of the bounding box. 
"},{"location":"3.1.Funcions_doc/#addgeocodericgcposition-object","title":"addGeocoderICGC([position]) \u2192Object","text":"
Add geocoder.
 
Kind: global function Returns: Object - - The current position of the search result.  
 Param Type Default Description [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#getconfigstyles-array","title":"getConfigStyles() \u2192Array","text":"
Retrieves the available base styles from default options.
 
Kind: global function Returns: Array - - Array containing the names of available base styles. 
"},{"location":"3.1.Funcions_doc/#getconfigwmslayers-array","title":"getConfigWMSLayers() \u2192Array","text":"
Retrieves the available WMS image layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available WMS image layers. 
"},{"location":"3.1.Funcions_doc/#getconfigortolayers-array","title":"getConfigOrtoLayers() \u2192Array","text":"
Retrieves the available orto image layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available image layers. 
"},{"location":"3.1.Funcions_doc/#getconfigvectorlayers-array","title":"getConfigVectorLayers() \u2192Array","text":"
Retrieves the available vector layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available vector layers. 
"},{"location":"3.1.Funcions_doc/#getconfigvectoradminlayers-array","title":"getConfigVectorAdminLayers() \u2192Array","text":"
Retrieves the available vector layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available vectorAdmin layers. 
"},{"location":"3.1.Funcions_doc/#getconfigfgbadminlayers-array","title":"getConfigFGBAdminLayers() \u2192Array","text":"
Retrieves the available fgb layers from default options.
 
Kind: global function Returns: Array - - Array containing the keys of available fgbadmin layers. 
"},{"location":"3.1.Funcions_doc/#fetchdataurl-idlayer-options","title":"fetchData(url, idLayer, options)","text":"
Fetches GeoJSON data from a URL and adds a corresponding layer to the map based on the specified geometry type.
 
Kind: global function  
 Param Type Description url string The URL to fetch GeoJSON data from. idLayer string The id for the layer. options Object Additional options for configuring the layer. 
"},{"location":"3.1.Funcions_doc/#fetchdataandmenuurl-idlayer-filterfield-options","title":"fetchDataAndMenu(url, idLayer, filterField, options)","text":"
Fetches GeoJSON data from a URL and adds a corresponding layer to the map based on the specified geometry type and adds to the Menu as a checkbox item.
 
Kind: global function  
 Param Type Description url string The URL to fetch GeoJSON data from. idLayer string The geometry name (e.g., 'buildings'). filterField string Import all features as unique or group based on a field ('all', 'field'). options Object Additional options for configuring the layer. 
"},{"location":"3.1.Funcions_doc/#ontype-func","title":"on(type, func)","text":"
Adds an event listener to the map.
 
Kind: global function  
 Param Type Description type string The type of the event. func function The callback function to be executed when the event occurs. 
"},{"location":"3.1.Funcions_doc/#setstylestyle-options","title":"setStyle(style, [options])","text":"
Sets the style of the map.
 
Kind: global function  
 Param Type Description style string Name of the map style. [options] Object Options for setting the style. 
"},{"location":"3.1.Funcions_doc/#addcontrolcontrol-position","title":"addControl(control, [position])","text":"
Adds a control to the map with the specified position.
 
Kind: global function  
 Param Type Default Description control Object The control to add. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#setskyoptions","title":"setSky(options)","text":"
Sets the sky properties of the map.
 
Kind: global function  
 Param Type Default Description options Object Options to set the sky properties. [options.skyType] string \"'gradient'\" Type of sky to set (e.g., 'gradient', 'atmosphere'). [options.color] string \"'lightblue'\" Color of the sky. [options.horizonBlend] Number 0.03 Blend horizon value. [options.starIntensity] Number 0.5 Intensity of stars in the sky. [options.sunIntensity] Number 0.1 Intensity of the sun in the sky. [options.sunPosition] Array.<Number> [0, 0] Position of the sun in the sky. 
"},{"location":"3.1.Funcions_doc/#addmousecoordcontrolposition","title":"addMouseCoordControl([position])","text":"
Adds a mouse coordinate control to the map.
 
Kind: global function  
 Param Type Default Description options.width Number Width control i. options.utm Boolean Boolean to show coordinates in UTM. options.lonlat Boolean Boolean to show coordinates in Lon Lat. [position] string \"'bottom-left'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addgeolocatecontroloptions-position","title":"addGeolocateControl(options, [position])","text":"
Adds a geolocate control to the map.
 
Kind: global function  
 Param Type Default Description options Object Options for the geolocate control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addfullscreencontroloptions-position","title":"addFullscreenControl(options, [position])","text":"
Adds a fullscreen control to the map.
 
Kind: global function  
 Param Type Default Description options Object Options for the geolocate control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addlayerlayer-layeridorder","title":"addLayer(layer, layerIdOrder)","text":"
Adds a layer to the map.
 
Kind: global function  
 Param Type Description layer Object Options for the layer to add. layerIdOrder string Optional layer Id draw position. 
"},{"location":"3.1.Funcions_doc/#addimageid-image-options-this","title":"addImage(id, image, options) \u2192this","text":"
Adds an image to the map.
 
Kind: global function  
 Param Type Description id string The ID of the image. image ImageBitmap | HTMLImageElement | ImageData | StyleImageInterface | object The image object to add. options Partial.<StyleImageMetadata> Optional metadata for the image. 
"},{"location":"3.1.Funcions_doc/#addsourceid-source-this","title":"addSource(id, source) \u2192this","text":"
Adds a source to the map.
 
Kind: global function  
 Param Type Description id string The ID of the source. source SourceSpecification The source object to add. 
"},{"location":"3.1.Funcions_doc/#addspriteid-url-options-this","title":"addSprite(id, url, options) \u2192this","text":"
Adds a sprite to the map.
 
Kind: global function  
 Param Type Description id string The ID of the sprite. url string The URL to load the sprite from. options StyleSetterOptions Options object. 
"},{"location":"3.1.Funcions_doc/#aretilesloaded-boolean","title":"areTilesLoaded() \u2192boolean","text":"
Checks if all tiles in the viewport are loaded.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#cameraforboundsbounds-options-centerzoombearing-undefined","title":"cameraForBounds(bounds, options) \u2192CenterZoomBearing | undefined","text":"
Calculates the camera position for given bounds.
 
Kind: global function  
 Param Type Description bounds LngLatBoundsLike The geographical bounds to fit. options CameraForBoundsOptions Options object. 
"},{"location":"3.1.Funcions_doc/#easetooptions-eventdata-this","title":"easeTo(options, eventData) \u2192this","text":"
Eases the camera to a new position.
 
Kind: global function  
 Param Type Description options object Options describing the animation. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#fitboundsbounds-options-eventdata-this","title":"fitBounds(bounds, options, eventData) \u2192this","text":"
Fits the map to the given geographical bounds.
 
Kind: global function  
 Param Type Description bounds LngLatBoundsLike The geographical bounds to fit. options FitBoundsOptions Options object. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#fitscreencoordinatesp0-p1-bearing-options-eventdata-this","title":"fitScreenCoordinates(p0, p1, bearing, options, eventData) \u2192this","text":"
Fits the map to the given screen coordinates.
 
Kind: global function  
 Param Type Description p0 PointLike First point on screen, in pixel coordinates. p1 PointLike Second point on screen, in pixel coordinates. bearing number Desired map bearing at end of animation, in degrees. options FitBoundsOptions Options object. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#flytooptions-eventdata-this","title":"flyTo(options, eventData) \u2192this","text":"
Flies the camera to a new position.
 
Kind: global function  
 Param Type Description options FlyToOptions Options describing the flight. eventData any Additional properties for event objects. 
"},{"location":"3.1.Funcions_doc/#getbearing-number","title":"getBearing() \u2192number","text":"
Gets the current bearing of the map.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getbounds-lnglatbounds","title":"getBounds() \u2192LngLatBounds","text":"
Gets the current geographical bounds of the map.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcameratargetelevation-number","title":"getCameraTargetElevation() \u2192number","text":"
Gets the elevation for the point where the camera is looking.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcanvas-htmlcanvaselement","title":"getCanvas() \u2192HTMLCanvasElement","text":"
Gets the map's  element. 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcanvascontainer-htmlelement","title":"getCanvasContainer() \u2192HTMLElement","text":"
Gets the HTML element containing the map's  element. 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#getcenter-lnglat","title":"getCenter() \u2192LngLat","text":"
Returns the map's geographical centerpoint.
 
Kind: global function Returns: LngLat - The map's geographical centerpoint. 
"},{"location":"3.1.Funcions_doc/#getcontainer-htmlelement","title":"getContainer() \u2192HTMLElement","text":"
Returns the map's containing HTML element.
 
Kind: global function Returns: HTMLElement - The map's container. 
"},{"location":"3.1.Funcions_doc/#getfeaturestatefeature-any","title":"getFeatureState(feature) \u2192any","text":"
Gets the state of a feature.
 
Kind: global function Returns: any - The state of the feature.  
 Param Type Description feature FeatureIdentifier Feature identifier. 
"},{"location":"3.1.Funcions_doc/#getfilterlayerid-void-filterspecification","title":"getFilter(layerId) \u2192void | FilterSpecification","text":"
Returns the filter applied to the specified style layer.
 
Kind: global function Returns: void | FilterSpecification - The layer's filter.  
 Param Type Description layerId string The ID of the style layer. 
"},{"location":"3.1.Funcions_doc/#getglyphs-string","title":"getGlyphs() \u2192string","text":"
Returns the value of the style's glyphs URL.
 
Kind: global function Returns: string - The glyphs Style's glyphs URL. 
"},{"location":"3.1.Funcions_doc/#getimageid-styleimage","title":"getImage(id) \u2192StyleImage","text":"
Returns an image currently available in the map.
 
Kind: global function Returns: StyleImage - An image in the map with the specified ID.  
 Param Type Description id string The ID of the image. 
"},{"location":"3.1.Funcions_doc/#getlayerid-stylelayer","title":"getLayer(id) \u2192StyleLayer","text":"
Returns the layer with the specified ID in the map's style.
 
Kind: global function Returns: StyleLayer - The layer with the specified ID.  
 Param Type Description id string The ID of the layer to get. 
"},{"location":"3.1.Funcions_doc/#getlayersorder-arraystring","title":"getLayersOrder() \u2192Array.<string>","text":"
Return the ids of all layers currently in the style, including custom layers, in order.
 
Kind: global function Returns: Array.<string> - Ids of layers, in order. 
"},{"location":"3.1.Funcions_doc/#getlayoutpropertylayerid-name-any","title":"getLayoutProperty(layerId, name) \u2192any","text":"
Returns the value of a layout property in the specified style layer.
 
Kind: global function Returns: any - The value of the specified layout property.  
 Param Type Description layerId string The ID of the layer. name string The name of the layout property. 
"},{"location":"3.1.Funcions_doc/#getlight-lightspecification","title":"getLight() \u2192LightSpecification","text":"
Returns the value of the light object.
 
Kind: global function Returns: LightSpecification - Light properties of the style. 
"},{"location":"3.1.Funcions_doc/#getmaxbounds-lnglatbounds","title":"getMaxBounds() \u2192LngLatBounds","text":"
Returns the maximum geographical bounds the map is constrained to.
 
Kind: global function Returns: LngLatBounds - The map's maximum geographical bounds. 
"},{"location":"3.1.Funcions_doc/#getmaxpitch-number","title":"getMaxPitch() \u2192number","text":"
Returns the map's maximum allowable pitch.
 
Kind: global function Returns: number - The maxPitch. 
"},{"location":"3.1.Funcions_doc/#getmaxzoom-number","title":"getMaxZoom() \u2192number","text":"
Returns the map's maximum allowable zoom level.
 
Kind: global function Returns: number - The maxZoom. 
"},{"location":"3.1.Funcions_doc/#getminpitch-number","title":"getMinPitch() \u2192number","text":"
Returns the map's minimum allowable pitch.
 
Kind: global function Returns: number - The minPitch. 
"},{"location":"3.1.Funcions_doc/#getminzoom-number","title":"getMinZoom() \u2192number","text":"
Returns the map's minimum allowable zoom level.
 
Kind: global function Returns: number - The minZoom. 
"},{"location":"3.1.Funcions_doc/#getpadding-paddingoptions","title":"getPadding() \u2192PaddingOptions","text":"
Returns the current padding applied around the map viewport.
 
Kind: global function Returns: PaddingOptions - The current padding around the map viewport. 
"},{"location":"3.1.Funcions_doc/#getpaintpropertylayerid-name-unknown","title":"getPaintProperty(layerId, name) \u2192unknown","text":"
Returns the value of a paint property in the specified style layer.
 
Kind: global function Returns: unknown - The value of the specified paint property.  
 Param Type Description layerId string The ID of the layer. name string The name of a paint property. 
"},{"location":"3.1.Funcions_doc/#getpitch-number","title":"getPitch() \u2192number","text":"
Returns the map's current pitch (tilt).
 
Kind: global function Returns: number - The map's current pitch, measured in degrees away from the plane of the screen. 
"},{"location":"3.1.Funcions_doc/#getpixelratio-number","title":"getPixelRatio() \u2192number","text":"
Returns the map's pixel ratio.
 
Kind: global function Returns: number - The pixel ratio. 
"},{"location":"3.1.Funcions_doc/#getrenderworldcopies-boolean","title":"getRenderWorldCopies() \u2192boolean","text":"
Returns the state of renderWorldCopies.
 
Kind: global function Returns: boolean - The renderWorldCopies. 
"},{"location":"3.1.Funcions_doc/#getsourceid-source","title":"getSource(id) \u2192Source","text":"
Returns the source with the specified ID in the map's style.
 
Kind: global function Returns: Source - The style source with the specified ID.  
 Param Type Description id string The ID of the source to get. 
"},{"location":"3.1.Funcions_doc/#getsprite-arrayobject","title":"getSprite() \u2192Array.<object>","text":"
Returns the as-is value of the style's sprite.
 
Kind: global function Returns: Array.<object> - Style's sprite list of id-url pairs. 
"},{"location":"3.1.Funcions_doc/#getstyle-stylespecification","title":"getStyle() \u2192StyleSpecification","text":"
Returns the map's MapLibre style object.
 
Kind: global function Returns: StyleSpecification - The map's style JSON object. 
"},{"location":"3.1.Funcions_doc/#getterrain-terrainspecification","title":"getTerrain() \u2192TerrainSpecification","text":"
Get the terrain-options if terrain is loaded.
 
Kind: global function Returns: TerrainSpecification - The TerrainSpecification passed to setTerrain. 
"},{"location":"3.1.Funcions_doc/#getzoom-number","title":"getZoom() \u2192number","text":"
Returns the map's current zoom level.
 
Kind: global function Returns: number - The map's current zoom level. 
"},{"location":"3.1.Funcions_doc/#hascontrolcontrol-boolean","title":"hasControl(control) \u2192boolean","text":"
Checks if a control exists on the map.
 
Kind: global function Returns: boolean - true if map contains control.  
 Param Type Description control IControl The IControl to check. 
"},{"location":"3.1.Funcions_doc/#hasimageid-boolean","title":"hasImage(id) \u2192boolean","text":"
Check whether or not an image with a specific ID exists in the style.
 
Kind: global function Returns: boolean - A Boolean indicating whether the image exists.  
 Param Type Description id string The ID of the image. 
"},{"location":"3.1.Funcions_doc/#ismoving-boolean","title":"isMoving() \u2192boolean","text":"
Returns true if the map is panning, zooming, rotating, or pitching due to a camera animation or user gesture.
 
Kind: global function Returns: boolean - true if the map is moving. 
"},{"location":"3.1.Funcions_doc/#isrotating-boolean","title":"isRotating() \u2192boolean","text":"
Returns true if the map is rotating due to a camera animation or user gesture.
 
Kind: global function Returns: boolean - true if the map is rotating. 
"},{"location":"3.1.Funcions_doc/#issourceloadedid-boolean","title":"isSourceLoaded(id) \u2192boolean","text":"
Returns a Boolean indicating whether the source is loaded.
 
Kind: global function Returns: boolean - A Boolean indicating whether the source is loaded.  
 Param Type Description id string The ID of the source to be checked. 
"},{"location":"3.1.Funcions_doc/#isstyleloaded-boolean-void","title":"isStyleLoaded() \u2192boolean | void","text":"
Returns a Boolean indicating whether the map's style is fully loaded.
 
Kind: global function Returns: boolean | void - A Boolean indicating whether the style is fully loaded. 
"},{"location":"3.1.Funcions_doc/#iszooming-boolean","title":"isZooming() \u2192boolean","text":"
Returns true if the map is zooming due to a camera animation or user gesture.
 
Kind: global function Returns: boolean - true if the map is zooming. 
"},{"location":"3.1.Funcions_doc/#jumptooptions-eventdata-this","title":"jumpTo(options, [eventData]) \u2192this","text":"
Changes any combination of center, zoom, bearing, and pitch, without an animated transition.
 
Kind: global function  
 Param Type Description options JumpToOptions Options object [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#listimages-arraystring","title":"listImages() \u2192Array.<string>","text":"
Returns an Array of strings containing the IDs of all images currently available in the map.
 
Kind: global function Returns: Array.<string> - An Array of strings containing the names of all sprites/images currently available in the map. 
"},{"location":"3.1.Funcions_doc/#listenstype-boolean","title":"listens(type) \u2192boolean","text":"
Returns a true if this instance of Evented or any forwardeed instances of Evented have a listener for the specified type.
 
Kind: global function Returns: boolean - true if there is at least one registered listener for specified event type, false otherwise.  
 Param Type Description type string The event type. 
"},{"location":"3.1.Funcions_doc/#loadimageurl-promisegetresourceresponseimagebitmaphtmlimageelement","title":"loadImage(url) \u2192Promise.<GetResourceResponse.<(ImageBitmap|HTMLImageElement)>>","text":"
Load an image from an external URL to be used with Map#addImage.
 
Kind: global function Returns: Promise.<GetResourceResponse.<(ImageBitmap|HTMLImageElement)>> - A promise that is resolved when the image is loaded.  
 Param Type Description url string The URL of the image file. Image file must be in png, webp, or jpg format. 
"},{"location":"3.1.Funcions_doc/#loaded-boolean","title":"loaded() \u2192boolean","text":"
Returns a Boolean indicating whether the map is fully loaded.
 
Kind: global function Returns: boolean - A Boolean indicating whether the map is fully loaded. 
"},{"location":"3.1.Funcions_doc/#addprotocolcustomprotocol-loadfn-void","title":"addProtocol(customProtocol, loadFn) \u2192void","text":"
Adds a custom load resource function that will be called when using a URL that starts with a custom URL schema.
 
Kind: global function  
 Param Type Description customProtocol string The protocol to hook, for example 'custom'. loadFn AddProtocolAction The function to use when trying to fetch a resource specified by the customProtocol. 
"},{"location":"3.1.Funcions_doc/#movelayerid-beforeid-this","title":"moveLayer(id, [beforeId]) \u2192this","text":"
Moves a layer to a different z-position.
 
Kind: global function  
 Param Type Description id string The ID of the layer to move. [beforeId] string The ID of an existing layer to insert the new layer before. 
"},{"location":"3.1.Funcions_doc/#panbyoffset-options-eventdata-this","title":"panBy(offset, [options], [eventData]) \u2192this","text":"
Pans the map by the specified offset.
 
Kind: global function  
 Param Type Description offset PointLike x and y coordinates by which to pan the map. [options] AnimationOptions Options object. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#pantolnglat-options-eventdata-this","title":"panTo(lnglat, [options], [eventData]) \u2192this","text":"
Pans the map to the specified location with an animated transition.
 
Kind: global function  
 Param Type Description lnglat LngLatLike The location to pan the map to. [options] AnimationOptions Options describing the destination and animation of the transition. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#projectlnglat-point","title":"project(lnglat) \u2192Point","text":"
Returns a Point representing pixel coordinates, relative to the map's container, that correspond to the specified geographical location.
 
Kind: global function Returns: Point - The Point corresponding to lnglat, relative to the map's container.  
 Param Type Description lnglat LngLatLike The geographical location to project. 
"},{"location":"3.1.Funcions_doc/#queryrenderedfeaturesgeometryoroptions-options-array","title":"queryRenderedFeatures([geometryOrOptions], [options]) \u2192Array","text":"
Queries rendered features within a specified geometry or bounding box.
 
Kind: global function Returns: Array - An array of GeoJSON Feature objects representing the features that intersect the query geometry.  
 Param Type Description [geometryOrOptions] GeometryLike | Array | Object The geometry or options for the query. [options] Object Options for the query. 
"},{"location":"3.1.Funcions_doc/#querysourcefeaturessourceid-parameters-array","title":"querySourceFeatures(sourceId, parameters) \u2192Array","text":"
Queries source features within a specified source.
 
Kind: global function Returns: Array - An array of GeoJSON Feature objects representing the features in the source that satisfy the query parameters.  
 Param Type Description sourceId string The ID of the source to query. parameters Object Parameters for the query. 
"},{"location":"3.1.Funcions_doc/#queryterrainelevationlnglatlike-number","title":"queryTerrainElevation(lngLatLike) \u2192number","text":"
Queries the terrain elevation at a specified geographical location.
 
Kind: global function Returns: number - The elevation (in meters) at the specified location.  
 Param Type Description lngLatLike LngLatLike The geographical location to query. 
"},{"location":"3.1.Funcions_doc/#redraw-this","title":"redraw() \u2192this","text":"
Redraws the map.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#remove-this","title":"remove() \u2192this","text":"
Removes the map from the DOM.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#removecontrolcontrol-this","title":"removeControl(control) \u2192this","text":"
Removes a control from the map.
 
Kind: global function  
 Param Type Description control Object The control to remove. 
"},{"location":"3.1.Funcions_doc/#removefeaturestatetarget-key-this","title":"removeFeatureState(target, [key]) \u2192this","text":"
Removes the state of a feature.
 
Kind: global function  
 Param Type Description target Object The target feature. [key] string The key of the state to remove. 
"},{"location":"3.1.Funcions_doc/#removeimageid-this","title":"removeImage(id) \u2192this","text":"
Removes an image from the style's sprite.
 
Kind: global function  
 Param Type Description id string The ID of the image to remove. 
"},{"location":"3.1.Funcions_doc/#removelayeridlayer","title":"removeLayer(idLayer)","text":"
Removes a layer from the map.
 
Kind: global function  
 Param Type Description idLayer string Identifier of the layer to remove. 
"},{"location":"3.1.Funcions_doc/#removesourceidlayer","title":"removeSource(idLayer)","text":"
Removes a source from the map.
 
Kind: global function  
 Param Type Description idLayer string Identifier of the source to remove. 
"},{"location":"3.1.Funcions_doc/#removespriteid-this","title":"removeSprite(id) \u2192this","text":"
Removes a sprite from the style.
 
Kind: global function  
 Param Type Description id string The ID of the sprite to remove. 
"},{"location":"3.1.Funcions_doc/#resetnorthoptions-eventdata-this","title":"resetNorth([options], [eventData]) \u2192this","text":"
Resets the map orientation so that north is up.
 
Kind: global function  
 Param Type Description [options] Object Options for the reset. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#resetnorthpitchoptions-eventdata-this","title":"resetNorthPitch([options], [eventData]) \u2192this","text":"
Resets the map orientation so that north is up and pitch is set to 0\u252c\u2591.
 
Kind: global function  
 Param Type Description [options] Object Options for the reset. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#resizeeventdata-this","title":"resize([eventData]) \u2192this","text":"
Resizes the map to fit its container.
 
Kind: global function  
 Param Type Description [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#rotatetobearing-options-eventdata-this","title":"rotateTo(bearing, [options], [eventData]) \u2192this","text":"
Rotates the map to the specified bearing with an animated transition.
 
Kind: global function  
 Param Type Description bearing number The desired bearing (in degrees) to rotate the map to. [options] Object Options for the rotation. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setbearingbearing-eventdata-this","title":"setBearing(bearing, [eventData]) \u2192this","text":"
Sets the map's bearing with an optional animated transition.
 
Kind: global function  
 Param Type Description bearing number The desired bearing (in degrees) to set for the map. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setcentercenter-eventdata-this","title":"setCenter(center, [eventData]) \u2192this","text":"
Sets the map's center coordinates with an optional animated transition.
 
Kind: global function  
 Param Type Description center LngLatLike The desired center coordinates to set for the map. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#seteventedparentparent-data-this","title":"setEventedParent([parent], [data]) \u2192this","text":"
Sets the parent of the map's event emitter.
 
Kind: global function  
 Param Type Description [parent] any The parent object to set for the event emitter. [data] any Additional data to pass to the parent. 
"},{"location":"3.1.Funcions_doc/#setfeaturestatefeature-state-this","title":"setFeatureState(feature, state) \u2192this","text":"
Sets the state of a feature.
 
Kind: global function  
 Param Type Description feature Object The feature to set the state for. state Object The state object to set for the feature. 
"},{"location":"3.1.Funcions_doc/#setfilterlayerid-filter-options-this","title":"setFilter(layerId, [filter], [options]) \u2192this","text":"
Sets the filter for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the filter for. [filter] Array The filter array to apply to the layer. [options] Object Options for the filter. 
"},{"location":"3.1.Funcions_doc/#setglyphsglyphsurl-options-this","title":"setGlyphs(glyphsUrl, [options]) \u2192this","text":"
Sets the glyphs for the map's style.
 
Kind: global function  
 Param Type Description glyphsUrl string The URL to the glyphs. [options] Object Options for setting the glyphs. 
"},{"location":"3.1.Funcions_doc/#setlayerzoomrangelayerid-minzoom-maxzoom-this","title":"setLayerZoomRange(layerId, minzoom, maxzoom) \u2192this","text":"
Sets the zoom range for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the zoom range for. minzoom number The minimum zoom level for the layer. maxzoom number The maximum zoom level for the layer. 
"},{"location":"3.1.Funcions_doc/#setlayoutpropertylayerid-name-value-options-this","title":"setLayoutProperty(layerId, name, value, [options]) \u2192this","text":"
Sets a layout property for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the layout property for. name string The name of the layout property to set. value any The value to set for the layout property. [options] Object Options for setting the layout property. 
"},{"location":"3.1.Funcions_doc/#setlightlight-options-this","title":"setLight(light, [options]) \u2192this","text":"
Sets the light for the map's style.
 
Kind: global function  
 Param Type Description light Object The light object to set for the map. [options] Object Options for setting the light. 
"},{"location":"3.1.Funcions_doc/#setmaxboundsbounds-this","title":"setMaxBounds(bounds) \u2192this","text":"
Sets the maximum bounds for the map.
 
Kind: global function  
 Param Type Description bounds Array The maximum bounds for the map. 
"},{"location":"3.1.Funcions_doc/#setmaxpitchmaxpitch-this","title":"setMaxPitch(maxPitch) \u2192this","text":"
Sets the maximum pitch for the map.
 
Kind: global function  
 Param Type Description maxPitch number The maximum pitch (in degrees) for the map. 
"},{"location":"3.1.Funcions_doc/#setmaxzoommaxzoom-this","title":"setMaxZoom(maxZoom) \u2192this","text":"
Sets the maximum zoom level for the map.
 
Kind: global function  
 Param Type Description maxZoom number The maximum zoom level for the map. 
"},{"location":"3.1.Funcions_doc/#setminpitchminpitch-this","title":"setMinPitch(minPitch) \u2192this","text":"
Sets the minimum pitch for the map.
 
Kind: global function  
 Param Type Description minPitch number The minimum pitch (in degrees) for the map. 
"},{"location":"3.1.Funcions_doc/#setminzoomminzoom-this","title":"setMinZoom(minZoom) \u2192this","text":"
Sets the minimum zoom level for the map.
 
Kind: global function  
 Param Type Description minZoom number The minimum zoom level for the map. 
"},{"location":"3.1.Funcions_doc/#setpaddingpadding-eventdata-this","title":"setPadding(padding, [eventData]) \u2192this","text":"
Sets padding for the map's container.
 
Kind: global function  
 Param Type Description padding Object The padding object to set for the map's container. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setpaintpropertylayerid-name-value-options-this","title":"setPaintProperty(layerId, name, value, [options]) \u2192this","text":"
Sets a paint property for a specified layer.
 
Kind: global function  
 Param Type Description layerId string The ID of the layer to set the paint property for. name string The name of the paint property to set. value any The value to set for the paint property. [options] Object Options for setting the paint property. 
"},{"location":"3.1.Funcions_doc/#setpitchpitch-eventdata-this","title":"setPitch(pitch, [eventData]) \u2192this","text":"
Sets the map's pitch angle with an optional animated transition.
 
Kind: global function  
 Param Type Description pitch number The desired pitch angle (in degrees) to set for the map. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#setpixelratiopixelratio-this","title":"setPixelRatio(pixelRatio) \u2192this","text":"
Sets the pixel ratio for the map.
 
Kind: global function  
 Param Type Description pixelRatio number The desired pixel ratio for the map. 
"},{"location":"3.1.Funcions_doc/#setrenderworldcopiesrenderworldcopies-this","title":"setRenderWorldCopies(renderWorldCopies) \u2192this","text":"
Sets whether the map should render world copies when the center longitude is greater than or less than \u252c\u2592180 degrees.
 
Kind: global function  
 Param Type Description renderWorldCopies boolean A boolean indicating whether to render world copies. 
"},{"location":"3.1.Funcions_doc/#setspritespriteurl-options-this","title":"setSprite(spriteUrl, [options]) \u2192this","text":"
Sets the sprite for the map's style.
 
Kind: global function  
 Param Type Description spriteUrl string The URL to the sprite. [options] Object Options for setting the sprite. 
"},{"location":"3.1.Funcions_doc/#setterrainoptions-this","title":"setTerrain(options) \u2192this","text":"
Loads a 3D terrain mesh based on a \"raster-dem\" source.
 
Kind: global function  
 Param Type Description options TerrainSpecification Options object specifying the terrain source. 
"},{"location":"3.1.Funcions_doc/#settransformrequesttransformrequest-this","title":"setTransformRequest(transformRequest) \u2192this","text":"
Updates the requestManager's transform request with a new function.
 
Kind: global function  
 Param Type Description transformRequest RequestTransformFunction The callback function to update the transform request. 
"},{"location":"3.1.Funcions_doc/#setzoomzoom-eventdata-this","title":"setZoom(zoom, [eventData]) \u2192this","text":"
Sets the map's zoom level.
 
Kind: global function  
 Param Type Description zoom number The zoom level to set (0-20). [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#snaptonorthoptions-eventdata-this","title":"snapToNorth([options], [eventData]) \u2192this","text":"
Snaps the map so that north is up (0\u252c\u2591 bearing), if the current bearing is close enough to it.
 
Kind: global function  
 Param Type Description [options] Object Options for snapping to north. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#stop-this","title":"stop() \u2192this","text":"
Stops any animated transition underway.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#triggerrepaint-void","title":"triggerRepaint() \u2192void","text":"
Triggers the rendering of a single frame.
 
Kind: global function 
"},{"location":"3.1.Funcions_doc/#unprojectpoint-lnglat","title":"unproject(point) \u2192LngLat","text":"
Returns geographical coordinates corresponding to the specified pixel coordinates.
 
Kind: global function Returns: LngLat - The geographical coordinates corresponding to the specified pixel coordinates.  
 Param Type Description point PointLike The pixel coordinates to unproject. 
"},{"location":"3.1.Funcions_doc/#updateimageid-image-this","title":"updateImage(id, image) \u2192this","text":"
Updates an existing image in the style's sprite.
 
Kind: global function  
 Param Type Description id string The ID of the image to update. image ImageBitmap | HTMLImageElement | ImageData | StyleImageInterface | object The new image data. 
"},{"location":"3.1.Funcions_doc/#zoominoptions-eventdata-this","title":"zoomIn([options], [eventData]) \u2192this","text":"
Increases the map's zoom level by 1.
 
Kind: global function  
 Param Type Description [options] Object Options for zooming in. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#zoomoutoptions-eventdata-this","title":"zoomOut([options], [eventData]) \u2192this","text":"
Decreases the map's zoom level by 1.
 
Kind: global function  
 Param Type Description [options] Object Options for zooming out. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#zoomtozoom-options-eventdata-this","title":"zoomTo(zoom, [options], [eventData]) \u2192this","text":"
Zooms the map to the specified zoom level with an animated transition.
 
Kind: global function  
 Param Type Description zoom number The zoom level to transition to. [options] Object Options for zooming to. [eventData] any Additional properties to be added to event objects of events triggered by this method. 
"},{"location":"3.1.Funcions_doc/#addlayergeojsonlayer-layerposition","title":"addLayerGeoJSON(layer, layerPosition)","text":"
Adds a GeoJSON layer to the map.
 
Kind: global function  
 Param Type Description layer Object Options for the GeoJSON layer to add. layer.id string Unique identifier for the layer. layer.data Object GeoJSON data for the layer. layer.type string Map layer type (e.g., 'symbol', 'circle', 'fill').   * layer.layout Object Layer layout configuration. layer.paint Object Layer paint configuration. layerPosition string Position of the layer: 'top', below 'labels' or below 'lines'. 
"},{"location":"3.1.Funcions_doc/#addlayerwmstiles-idlayer-options","title":"addLayerWMS(tiles, idLayer, options)","text":"
Adds a WMS layer to the map.
 
Kind: global function  
 Param Type Description tiles Array.<string> Tiles for the raster layer. idLayer string Unique identifier for the layer. options Object Options of the layer: layout, paint and layerPosition. 
"},{"location":"3.1.Funcions_doc/#addlogooptions","title":"addLogo(options)","text":"
Adds a logo to the map.
 
Kind: global function  
 Param Type Description options Object Options for the logo to add. options.id string Unique identifier for the logo. options.url string URL of the logo image. options.href string URL to navigate to when the logo is clicked. options.height string Height of the logo. 
"},{"location":"3.1.Funcions_doc/#addbasemapsicgcbasesarray","title":"addBasemapsICGC(basesArray)","text":"
Adds base layers to the map.
 
Kind: global function  
 Param Type Description basesArray Array.<Object> Array of base layer objects. 
"},{"location":"3.1.Funcions_doc/#addbasemapsbaselayers","title":"addBasemaps(baseLayers)","text":"
Adds base layers to the map.
 
Kind: global function  
 Param Type Description baseLayers Array.<Object> Array of base layer objects. baseLayers.label string Label for the base layer. baseLayers.image string URL of the image representing the base layer. baseLayers.url string URL of the base layer style. 
"},{"location":"3.1.Funcions_doc/#addfeaturequeryidlayer-queryfields-popupstyle","title":"addFeatureQuery(idLayer, queryFields, popupStyle)","text":"
Adds feature query function to a layer.
 
Kind: global function  
 Param Type Description idLayer string name of the layer queryFields objetc optional indications for the popup popupStyle objetc optional indications for the popup style 
"},{"location":"3.1.Funcions_doc/#addscalecontroloptions-position","title":"addScaleControl(options, position)","text":"
Adds a scale control to the map.  * @function addScaleControl
 
Kind: global function  
 Param Type Description options Object Options for configuring the scale control. position string The position on the map to place the scale control (e.g., 'top-left', 'bottom-right'). 
"},{"location":"3.1.Funcions_doc/#addexportcontroloptions-position","title":"addExportControl(options, [position])","text":"
Adds an export control to the map with the provided options and position.
 
Kind: global function  
 Param Type Description options Object | string Options for the export control or position if provided as a string. [position] string Position to place the export control (e.g., 'top-right'). 
"},{"location":"3.1.Funcions_doc/#addmarkeroptions-object","title":"addMarker(options) \u2192Object","text":"
Adds a marker to the map.
 
Kind: global function Returns: Object - - Instance of the added marker.  
 Param Type Description options Object Options for the marker to add. options.text string Text content for the marker popup. options.options Object Marker options. options.coord LngLatLike Coordinates for placing the marker. options.textOffset Object Text offset for the marker popup. 
"},{"location":"3.1.Funcions_doc/#addpopupoptions-coord-text-popupstyle-object","title":"addPopup(options, coord, text, popupStyle) \u2192Object","text":"
Adds a popup to the map.
 
Kind: global function Returns: Object - - Instance of the added popup.  
 Param Type Description options Object Options for the popup to add. coord LngLatLike Coordinates for placing the popup. text string HTML content for the popup. popupStyle string css content for the popup style. 
"},{"location":"3.1.Funcions_doc/#addfullscreenposition","title":"addFullScreen([position])","text":"
Adds a fullscreen control to the map.
 
Kind: global function  
 Param Type Default Description [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addmenuitemname","title":"addMenuItem(name)","text":"
Adds a menu item with a checkbox for controlling the visibility of a layer on the map.
 
Kind: global function  
 Param Type Description name string The name of the layer corresponding to the menu item. 
"},{"location":"3.1.Funcions_doc/#addlayertreeoptions","title":"addLayerTree(options)","text":"
Adds a layer tree to the map.
 
Kind: global function  
 Param Type Description options Object Options for the layer tree to add. options.features Object Features for the layer tree. options.id string Unique identifier for the layer tree. options.type string Type of layer tree ('geojson', 'raster', etc.). 
"},{"location":"3.1.Funcions_doc/#createnavigationcontroloptions-position-object","title":"createNavigationControl(options, [position]) \u2192Object","text":"
Creates a navigation control with the provided options.
 
Kind: global function Returns: Object - - Instance of the created navigation control.  
 Param Type Default Description options Object Options for the navigation control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addnavigationcontroloptions-position","title":"addNavigationControl(options, [position])","text":"
Adds a navigation control to the map with the provided options.
 
Kind: global function  
 Param Type Default Description options Object Options for the navigation control. [position] string \"'top-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addattributioncontroloptions-position","title":"addAttributionControl(options, [position])","text":"
Adds an attribution control to the map with the provided options.
 
Kind: global function  
 Param Type Default Description options Object Options for the attribution control. [position] string \"'bottom-right'\" Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addimagelayericgcurl-idlayer-options","title":"addImageLayerICGC(url, idLayer, options)","text":"
Adds an ICGC image layer to the map based on the specified name and year.
 
Kind: global function  
 Param Type Description url string The url of the  layer. idLayer string The user id for the  layer. options object Type, position,layout and paint options for the layer 
"},{"location":"3.1.Funcions_doc/#addvectorlayericgcurl-idlayer-options","title":"addVectorLayerICGC(url, idLayer, options)","text":"
Adds an ICGC vector layer to the map based on the specified name and year.
 
Kind: global function  
 Param Type Description url string The url of the vector layer. idLayer string The user id for the vector layer. options object Type, position,layout and paint options for the layer 
"},{"location":"3.1.Funcions_doc/#addfgblayericgcurl-idlayer-options","title":"addFGBLayerICGC(url, idLayer, options)","text":"
Adds an ICGC FGB layer to the map based on the specified name and year.
 
Kind: global function  
 Param Type Description url string The url of the FGB layer. idLayer string Id for the layer. options object Paint option for the layer 
"},{"location":"3.1.Funcions_doc/#addterrainicgcurl-controlposition","title":"addTerrainICGC(url, controlPosition)","text":"
Adds 3D terrain to the map using hillshade.
 
Kind: global function  
 Param Type Description url string dataset url of the terrain controlPosition string Position to add the control on the map. 
"},{"location":"3.1.Funcions_doc/#addlegendurl-idlayer","title":"addLegend(url, idLayer)","text":"
Add image legend.
 
Kind: global function  
 Param Type Description url string image legend url. idLayer string layer's name. 
"},{"location":"3.1.Funcions_doc/#_findimagetypeurl-var1-var2-var3-var4-string-null","title":"_findImageType(url, var1, var2, var3, var4) \u2192string | null","text":"
Finds the type of image based on the provided URL and specified vectors.
 
Kind: global function Returns: string | null - - The type of image if found, otherwise null.  
 Param Type Description url string The URL of the image to find the type for. var1 Object The first vector object containing key-value pairs. var2 Object The second vector object containing key-value pairs. var3 Object The third vector object containing key-value pairs. var4 Object The fourth vector object containing key-value pairs. 
"},{"location":"3.1.Funcions_doc/#_getkeybyurlfgburl-string-null","title":"_getKeyByUrlFGB(url) \u2192string | null","text":"
Gets the key by URL from the FGBAdmin layers.
 
Kind: global function Returns: string | null - - The key if found, otherwise null.  
 Param Type Description url string The URL to find the key for in the FGBAdmin layers. 
"},{"location":"3.1.Funcions_doc/#_getlegendbynamename-string-null","title":"_getLegendByName(name) \u2192string | null","text":"
Gets the legend by name from the default vector layers.
 
Kind: global function Returns: string | null - - The legend if found, otherwise null.  
 Param Type Description name string The name of the vector layer to get the legend for. 
"},{"location":"3.1.Funcions_doc/#_getkeybyurlvectorurl-string-null","title":"_getKeyByUrlVector(url) \u2192string | null","text":"
Gets the key by URL from the Vector layers.
 
Kind: global function Returns: string | null - - The key if found, otherwise null.  
 Param Type Description url string The URL to find the key for in the Vector layers. 
"},{"location":"3.1.Funcions_doc/#_raisetext3dstyle-promisevoid","title":"_raiseText3DStyle() \u2192Promise.<void>","text":"
Raises text 3D style on the map.
 
Kind: global function Returns: Promise.<void> - - A promise that resolves after updating the text 3D style on the map. 
"},{"location":"3.1.Funcions_doc/#_dealstylemapsname-object-string-null","title":"_dealStyleMaps(name) \u2192Object | string | null","text":"
Deals with map styles based on the name.
 
Kind: global function Returns: Object | string | null - - The map style object if found, or the input name if not found, or null if an error occurs.  
 Param Type Description name string The name of the map style. 
"},{"location":"3.1.Funcions_doc/#_dealorto3dstylename-void-null","title":"_dealOrto3dStyle(name) \u2192void | null","text":"
Deals with the 3D ortho style based on the name.
 
Kind: global function Returns: void | null - - Returns null if an error occurs.  
 Param Type Description name string The name of the orto3D style. 
"},{"location":"3.1.Funcions_doc/#_dealorderlayerorder-string","title":"_dealOrderLayer(order) \u2192string","text":"
Deals with the order of the layer.
 
Kind: global function Returns: string - - The id of the first symbol layer if the order is 'symbol', the id of the first line layer if the order is 'line', otherwise an empty string.  
 Param Type Description order string The order of the layer. 
"},{"location":"3.1.Funcions_doc/#_firstsymbollayer-string-undefined","title":"_firstSymbolLayer() \u2192string | undefined","text":"
Retrieves the id of the first symbol layer.
 
Kind: global function Returns: string | undefined - - The id of the first symbol layer if found, otherwise undefined. 
"},{"location":"3.1.Funcions_doc/#_firstlinelayer-string-undefined","title":"_firstLineLayer() \u2192string | undefined","text":"
Retrieves the id of the first line layer.
 
Kind: global function Returns: string | undefined - - The id of the first line layer if found, otherwise undefined. 
"},{"location":"3.1.Funcions_doc/#_createcitiesmapboxlayer-mapboxlayer-null","title":"_createCitiesMapboxLayer() \u2192MapboxLayer | null","text":"
Creates a Mapbox layer for displaying cities in 3D.
 
Kind: global function Returns: MapboxLayer | null - - The Mapbox layer for displaying cities in 3D if created successfully, otherwise null.  
"},{"location":"4.1.Versio/","title":"4.1.Versio","text":""},{"location":"4.1.Versio/#versionat","title":"Versionat","text":"
v. 1.0.0 
"}]}
\ No newline at end of file
diff --git a/sitemap.xml b/sitemap.xml
index 031bd40..f498313 100755
--- a/sitemap.xml
+++ b/sitemap.xml
@@ -2,117 +2,117 @@
 
     
          https://openicgc.github.io/mapicgc-doc/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/1.1.Inst_npm/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/1.2.Inst_cdn/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.1.0.Map/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.1.2.AddICGCTerrain/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.1.3.3dStyle/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.10.AddLogo/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.11.FetchData/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.12.FetchDataAndMenu/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.13.AddFeatureQuery/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.14.AddGeocoderICGC/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.2.AddBasemap/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.20.AdvancedExample/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.21.Maplibre2Mapicgc/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.3.AddImageLayerICGC/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.4.AddVectorLayerICGC/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.5.AddLayerGeojson/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.6.AddLayerTree/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.7.AddMarker/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.8.AddControl/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/2.9.AddCompare/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/3.1.Funcions_doc/
-         2024-07-22
+         2024-10-15
          daily
     
     
          https://openicgc.github.io/mapicgc-doc/4.1.Versio/
-         2024-07-22
+         2024-10-15
          daily
     
 
\ No newline at end of file
diff --git a/sitemap.xml.gz b/sitemap.xml.gz
index a537e46d38c7acca380183f56f8940de1f564830..6eaefb4f547186b90a6e00c9b7b7d84841b22e74 100755
GIT binary patch
delta 443
zcmV;s0Yv`G1Iz;mABzYG#1Rf>kq8}scAGlW)#!A~5_d38uLj}SqAgUQ`}6IE*68lW
z#K)yA1@a4l_aM96*VSMP#!9VbQ9|Nq0E%lNRWXYmH;dtUbeW%It*I=yfp4trEGnIA
zE-2mYcEm~tHES%+^6
zLZqg?bEp{#&1ptM}1ojnnZkiHFI=H~FeNYQ{^Z3V1c}kqaiPLq?BkdKCRu
z{lb@!gshZx&#I{rVACGUh5Gl{)X!{8)_x&jkf!8Hh}C>K-+(bp;+WnM8HopXr~rdD
z4l{hG3ylGrkOeqi-Y~~7aMK@u?v)a2P%Q@aD6EJDFxMKmZ^0ZepvM8d1nsjdm=G`!
zpu6C9&1{#}5pYAO*fPaI-0oT3ponj25^`N7Uks${{tp6mw*^-uWbU9D%H_P!!a#kGVovj`CQE05)JgK~I
zPbuAQx5OzA4R0MWwxmu};lt6dN}7^cQXGszi31F8eaUMhia3f3!VJ=AVP;dZ4hso`l#z2OSBvY#2CU@@$MjCfMBe#b4H&d(
zoZ%Z&8VuNsEWwNFl6#JU%YL|j=UT2ocNo-@xFVLoeP`je1G~e3o<{UFn2=?`#(;qU
z-3PY|?)tQjfEz=_JJ$l_)dz1{6!DE^G1t}V$pTvse-NnqEx2lU2{(L)WU|K7!Dan-{y@44Eyjng4f)>f<>S`iQ0wH-kKT#cQ$Y-o0i-EzZNFp
kguLvu2zO)mh~X|e4d93VGXM9~{^7tEpX@U^q(l$^00ZgU2mk;8

diff --git a/test/index 1 (1).html b/test/index 1 (1).html
index e8e4db0..6ae7371 100755
--- a/test/index 1 (1).html	
+++ b/test/index 1 (1).html	
@@ -4,8 +4,8 @@
     
     Exemple biblioteca mapicgc-gl-js
     
-    
-    
+    
+