add new contexmaps styles

OpenICGC · Oct 18, 2021 · 332ace8 · 332ace8
1 parent 8dcc26e
commit 332ace8
Show file tree

Hide file tree

Showing 49 changed files with 892 additions and 461 deletions.
diff --git a/exemples/keplergl/icgc-basemap-keplergl-map.html b/exemples/keplergl/icgc-basemap-keplergl-map.html
@@ -191,7 +191,7 @@
            */
           (function customize(keplerGl, store) {
             const datasets = [];
-            const config = {"version":"v1","config":{"visState":{"filters":[],"layers":[],"interactionConfig":{"tooltip":{"fieldsToShow":{},"compareMode":false,"compareType":"absolute","enabled":true},"brush":{"size":0.5,"enabled":false},"geocoder":{"enabled":false},"coordinate":{"enabled":false}},"layerBlending":"normal","splitMaps":[],"animationConfig":{"currentTime":null,"speed":1}},"mapState":{"bearing":0,"dragRotate":false,"latitude":41.75925664504067,"longitude":0.7991020905454174,"pitch":0,"zoom":7.3388021082079185,"isSplit":false},"mapStyle":{"styleType":"gbhyw3","topLayerGroups":{},"visibleLayerGroups":{"label":true,"road":true,"building":true,"water":true,"land":true},"threeDBuildingColor":[230.92517894351974,227.2005792831404,223.47597962276103],"mapStyles":{"gbhyw3":{"accessToken":null,"custom":true,"icon":"https://api.mapbox.com/styles/v1/https://geoserveis.icgc.cat/contextmaps/icgc.json/static/-122.3391,37.7922,9,0,0/400x300?access_token=pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyMjNhcWIwc29sMnVzMThoZ3djNXhzIn0._hfBNwCD7pCU7RAMOq6vUQ&logo=false&attribution=false","id":"gbhyw3","label":"ICGC","url":"https://geoserveis.icgc.cat/contextmaps/icgc.json"}}}}};
+            const config = {"version":"v1","config":{"visState":{"filters":[],"layers":[],"interactionConfig":{"tooltip":{"fieldsToShow":{},"compareMode":false,"compareType":"absolute","enabled":true},"brush":{"size":0.5,"enabled":false},"geocoder":{"enabled":false},"coordinate":{"enabled":false}},"layerBlending":"normal","splitMaps":[],"animationConfig":{"currentTime":null,"speed":1}},"mapState":{"bearing":0,"dragRotate":false,"latitude":41.75925664504067,"longitude":0.7991020905454174,"pitch":0,"zoom":7.3388021082079185,"isSplit":false},"mapStyle":{"styleType":"gbhyw3","topLayerGroups":{},"visibleLayerGroups":{"label":true,"road":true,"building":true,"water":true,"land":true},"threeDBuildingColor":[230.92517894351974,227.2005792831404,223.47597962276103],"mapStyles":{"gbhyw3":{"accessToken":null,"custom":true,"icon":"https://api.mapbox.com/styles/v1/https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard.json/static/-122.3391,37.7922,9,0,0/400x300?access_token=pk.eyJ1IjoidWNmLW1hcGJveCIsImEiOiJja2tyMjNhcWIwc29sMnVzMThoZ3djNXhzIn0._hfBNwCD7pCU7RAMOq6vUQ&logo=false&attribution=false","id":"gbhyw3","label":"ICGC","url":"https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard.json"}}}}};
 
             const loadedData = keplerGl.KeplerGlSchema.load(
               datasets,

diff --git a/exemples/leaflet/icgc-raster-leaflet-map.html b/exemples/leaflet/icgc-raster-leaflet-map.html
@@ -31,7 +31,7 @@
         zoom: 10,
         attribution: 'Institut Cartogràfic i Geològic de Catalunya CC-BY-SA-3'
       });
-      const topoMonICGC = L.tileLayer('https://geoserveis.icgc.cat/styles/icgc/{z}/{x}/{y}.png', {
+      const topoMonICGC = L.tileLayer('https://geoserveis.icgc.cat/styles/icgc_mapa_estandard/{z}/{x}/{y}.png', {
         maxZoom: 19,
         attribution: 'Institut Cartogràfic i Geològic de Catalunya CC-BY-SA-3'
       }).addTo(map);

diff --git a/exemples/mapboxgl/icgc-basemap-mapbox-code.html b/exemples/mapboxgl/icgc-basemap-mapbox-code.html
@@ -152,18 +152,18 @@
 &#x3C;/head&#x3E;
 &#x3C;body&#x3E;
     &#x3C;div id='menu'&#x3E;
-        &#x3C;input id='icgc' type='radio' name='rtoggle' value='icgc' checked='checked'&#x3E;
-        &#x3C;label for='icgc'&#x3E;icgc&#x3C;/label&#x3E;
-        &#x3C;input id='osm-bright' type='radio' name='rtoggle' value='osm-bright'&#x3E;
-        &#x3C;label for='osm-bright'&#x3E;osm-bright&#x3C;/label&#x3E;
-        &#x3C;input id='positron' type='radio' name='rtoggle' value='positron'&#x3E;
-        &#x3C;label for='positron'&#x3E;positron&#x3C;/label&#x3E;
-        &#x3C;input id='fulldark' type='radio' name='rtoggle' value='fulldark'&#x3E;
-        &#x3C;label for='fulldark'&#x3E;fulldark&#x3C;/label&#x3E;
-        &#x3C;input id='night' type='radio' name='rtoggle' value='night'&#x3E;
-        &#x3C;label for='night'&#x3E;night&#x3C;/label&#x3E;
-        &#x3C;input id='hibrid' type='radio' name='rtoggle' value='hibrid'&#x3E;
-        &#x3C;label for='hibrid'&#x3E;hibrid&#x3C;/label&#x3E;
+    &#x3C;input id='icgc_mapa_estandard' type='radio' name='rtoggle' value='icgc_mapa_estandard' checked='checked'&#x3E;
+    &#x3C;label for='icgc_mapa_estandard'&#x3E;Mapa estàndard&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_mapa_base_gris' type='radio' name='rtoggle' value='icgc_mapa_base_gris'&#x3E;
+    &#x3C;label for='icgc_mapa_base_gris'&#x3E;Mapa base gris&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_delimitacio_estandard' type='radio' name='rtoggle' value='icgc_delimitacio_estandard'&#x3E;
+    &#x3C;label for='icgc_delimitacio_estandard'&#x3E;Delimitació estàndard&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_xarxa_viaria_estandard' type='radio' name='rtoggle' value='icgc_xarxa_viaria_estandard'&#x3E;
+    &#x3C;label for='icgc_xarxa_viaria_estandard'&#x3E;Xarxa viària estàndard&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_arees_poblament' type='radio' name='rtoggle' value='icgc_arees_poblament'&#x3E;
+    &#x3C;label for='icgc_arees_poblament'&#x3E;Àrees poblament&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_orto_hibrida' type='radio' name='rtoggle' value='icgc_orto_hibrida'&#x3E;
+    &#x3C;label for='icgc_orto_hibrida'&#x3E;Orto híbrida&#x3C;/label&#x3E;
     &#x3C;/div&#x3E;
     &#x3C;div id='div_pitch' class="mapboxgl-ctrl-group mapboxgl-ctrl"&#x3E;
         &#x3C;button id="bt_pitch" title="Perspectiva" class="mapboxgl-ctrl-icon glyphicon glyphicon-road"&#x3E;&#x3C;/button&#x3E;
@@ -172,7 +172,7 @@
     &#x3C;script type="module"&#x3E;
        const map = new mapboxgl.Map({
             container: 'map',
-            style: 'https://geoserveis.icgc.cat/contextmaps/icgc.json',
+            style: 'https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard.json',
            center: [1.1464, 41.706],
             zoom: 7.4,
             maxZoom: 14,

diff --git a/exemples/mapboxgl/icgc-basemap-mapbox-map.html b/exemples/mapboxgl/icgc-basemap-mapbox-map.html
@@ -1,4 +1,5 @@
 <html>
+
 <head>
     <meta charset='utf-8' />
     <title>Exemple mapbox i ContextMaps ICGC</title>
@@ -11,13 +12,15 @@
             margin: 0;
             padding: 0;
         }
+
         #map {
             position: absolute;
             top: 0;
             bottom: 0;
             width: 100%;
             height: 100%
         }
+
         #menu {
             position: absolute;
             z-index: 1000;
@@ -31,13 +34,15 @@
             -moz-box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
             box-shadow: 5px 5px 5px -5px rgba(0, 0, 0, 0.75);
         }
+
         #div_pitch {
             position: absolute;
             right: 10px;
             top: 142px;
             width: 30px;
             z-index: 100;
         }
+
         .sliderClass {
             position: absolute;
             left: 10px;
@@ -53,41 +58,42 @@
         }
     </style>
 </head>
+
 <body>
     <div id='menu'>
-        <input id='icgc' type='radio' name='rtoggle' value='icgc' checked='checked'>
-        <label for='icgc'>icgc</label>
-        <input id='osm-bright' type='radio' name='rtoggle' value='osm-bright'>
-        <label for='osm-bright'>osm-bright</label>
-        <input id='positron' type='radio' name='rtoggle' value='positron'>
-        <label for='positron'>positron</label>
-        <input id='fulldark' type='radio' name='rtoggle' value='fulldark'>
-        <label for='fulldark'>fulldark</label>
-        <input id='night' type='radio' name='rtoggle' value='night'>
-        <label for='night'>night</label>
-        <input id='hibrid' type='radio' name='rtoggle' value='hibrid'>
-        <label for='hibrid'>hibrid</label>
+        <input id='icgc_mapa_estandard' type='radio' name='rtoggle' value='icgc_mapa_estandard' checked='checked'>
+        <label for='icgc_mapa_estandard'>Mapa estàndard</label><br>
+        <input id='icgc_mapa_base_gris' type='radio' name='rtoggle' value='icgc_mapa_base_gris'>
+        <label for='icgc_mapa_base_gris'>Mapa base gris</label><br>
+        <input id='icgc_delimitacio_estandard' type='radio' name='rtoggle' value='icgc_delimitacio_estandard'>
+        <label for='icgc_delimitacio_estandard'>Delimitació estàndard</label><br>
+        <input id='icgc_xarxa_viaria_estandard' type='radio' name='rtoggle' value='icgc_xarxa_viaria_estandard'>
+        <label for='icgc_xarxa_viaria_estandard'>Xarxa viària estàndard</label><br>
+        <input id='icgc_arees_poblament' type='radio' name='rtoggle' value='icgc_arees_poblament'>
+        <label for='icgc_arees_poblament'>Àrees poblament</label><br>
+        <input id='icgc_orto_hibrida' type='radio' name='rtoggle' value='icgc_orto_hibrida'>
+        <label for='icgc_orto_hibrida'>Orto híbrida</label>
     </div>
     <div id='div_pitch' class="mapboxgl-ctrl-group mapboxgl-ctrl">
         <button id="bt_pitch" title="Perspectiva" class="mapboxgl-ctrl-icon glyphicon glyphicon-road"></button>
     </div>
     <div id="map"></div>
     <script type="module">
-       const map = new mapboxgl.Map({
+        const map = new mapboxgl.Map({
             container: 'map',
-            style: 'https://geoserveis.icgc.cat/contextmaps/icgc.json',
-           center: [1.1464, 41.706],
+            style: 'https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard.json',
+            center: [1.1464, 41.706],
             zoom: 7.4,
             maxZoom: 14,
             hash: true,
             pitch: 0,
-			attributionControl: false
+            attributionControl: false
         });
         map.on('load', function () {
             map.addControl(new mapboxgl.NavigationControl());
-			map.addControl(new mapboxgl.AttributionControl({
-               compact: true
-			}));
+            map.addControl(new mapboxgl.AttributionControl({
+                compact: true
+            }));
             map.addControl(new mapboxgl.GeolocateControl({
                 positionOptions: {
                     enableHighAccuracy: true,
@@ -100,7 +106,7 @@
         const button = document.getElementById('bt_pitch');
         function switchLayer(layer) {
             const layerId = layer.target.id;
-                map.setStyle('https://geoserveis.icgc.cat/contextmaps/' + layerId + '.json');
+            map.setStyle('https://geoserveis.icgc.cat/contextmaps/' + layerId + '.json');
         }
         function canviaPerspectiva() {
             const pitch = parseInt(map.getPitch());
@@ -109,10 +115,11 @@
                 'pitch': pitch
             })
         };
-        for (let  i = 0; i < inputs.length; i++) {
+        for (let i = 0; i < inputs.length; i++) {
             inputs[i].onclick = switchLayer;
         }
         button.onclick = canviaPerspectiva;
     </script>
 </body>
+
 </html>
diff --git a/exemples/mapboxgl/icgc-lidar-map-mapbox.html b/exemples/mapboxgl/icgc-lidar-map-mapbox.html
@@ -25,7 +25,7 @@
   const map = new mapboxgl.Map({
     container: 'map',
 //REPLACE THIS WITH THE MAPBOX STYLE URL OF YOUR CHOICE   
-    style: 'https://geoserveis.icgc.cat/contextmaps/positron.json',
+    style: 'https://geoserveis.icgc.cat/contextmaps/icgc_delimitacio_estandard.json',
     center: [0.902638,41.251877],
     zoom: 13.40,
     bearing: 0,

diff --git a/exemples/mapboxgl/icgc-terrain-rgb-mapbox-code.html b/exemples/mapboxgl/icgc-terrain-rgb-mapbox-code.html
@@ -139,7 +139,7 @@
                     'pk.eyJ1IjoiZ2Vvc3RhcnRlcnMiLCJhIjoiMGNxekwxayJ9.sE1YC8Zxwzjh4CQeZiZN_g';
                 const map = new mapboxgl.Map({
                     container: 'map',
-                    style: 'https://geoserveis.icgc.cat/contextmaps/hibrid.json',
+                    style: 'https://geoserveis.icgc.cat/contextmaps/icgc_orto_hibrida.json',
                     center: [1.71611, 42.23818],
                     zoom: 14.03,
                     attributionControl: false,

diff --git a/exemples/mapboxgl/icgc-terrain-rgb-mapbox-map.html b/exemples/mapboxgl/icgc-terrain-rgb-mapbox-map.html
@@ -42,7 +42,7 @@
             'pk.eyJ1IjoiZ2Vvc3RhcnRlcnMiLCJhIjoiMGNxekwxayJ9.sE1YC8Zxwzjh4CQeZiZN_g';
         const map = new mapboxgl.Map({
             container: 'map',
-            style: 'https://geoserveis.icgc.cat/contextmaps/hibrid.json',
+            style: 'https://geoserveis.icgc.cat/contextmaps/icgc_orto_hibrida.json',
             center: [1.71611, 42.23818],
             zoom: 14.03,
             attributionControl: false,

diff --git a/exemples/maplibre/icgc-basemap-maplibre-code.html b/exemples/maplibre/icgc-basemap-maplibre-code.html
@@ -1,4 +1,5 @@
 <html lang="ca">
+
 <head>
   <!-- Global site tag (gtag.js) - Google Analytics -->
   <script async src="https://www.googletagmanager.com/gtag/js?id=UA-46332195-9"></script>
@@ -41,24 +42,28 @@
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
   <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
     integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous">
-  </script>
+    </script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.3/js/bootstrap.min.js"
     integrity="sha384-a5N7Y/aK3qNeh15eJKGWxsqtnX/wWdSZSKp+81YjTmS15nvnvxKHuzaWwXHDli+4" crossorigin="anonymous">
-  </script>
+    </script>
   <script src="https://cdn.rawgit.com/google/code-prettify/master/loader/run_prettify.js"></script>
   <style>
     body {
       margin: 0;
     }
+
     .soft {
       background-color: #f7f7f7
     }
+
     .titol {
       padding: 15px
     }
+
     .container {
       border: 1px solid #f7f7f7
     }
+
     li.L0,
     li.L1,
     li.L2,
@@ -71,6 +76,7 @@
     }
   </style>
 </head>
+
 <body>
   <!-- Google Tag Manager (noscript) -->
   <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-MGS4TSP" height="0" width="0"
@@ -83,10 +89,12 @@
         <br>
         <div>
           <p>
-            <a  target ="_blank" 
- href="https://github.com/OpenICGC/OpenICGC.github.io/blob/master/exemples/maplibre/icgc-basemap-maplibre-map.html">Veure codi font
+            <a target="_blank"
+              href="https://github.com/OpenICGC/OpenICGC.github.io/blob/master/exemples/maplibre/icgc-basemap-maplibre-map.html">Veure
+              codi font
               <i class="fab fa-github"></i></a>
-            <a href="/exemples/maplibre/icgc-basemap-maplibre-map.html">pantalla completa <i class="fas fa-expand"></i></a>
+            <a href="/exemples/maplibre/icgc-basemap-maplibre-map.html">pantalla completa <i
+                class="fas fa-expand"></i></a>
           </p>
         </div>
       </div>
@@ -100,8 +108,8 @@
     &#x3C;meta charset='utf-8'/&#x3E;
     &#x3C;title&#x3E;Exemple MapLibre i ContextMaps ICGC&#x3C;/title&#x3E;
     &#x3C;meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no'/&#x3E;
-    &#x3C;script src="https://unpkg.com/maplibre-gl@1.14.0-rc.1/dist/maplibre-gl.js"&#x3E;&#x3C;/script&#x3E;
-    &#x3C;link href="https://unpkg.com/maplibre-gl@1.14.0-rc.1/dist/maplibre-gl.css" rel="stylesheet"/&#x3E;
+    &#x3C;script src="https://unpkg.com/maplibre-gl@1.15.0/dist/maplibre-gl.js"&#x3E;&#x3C;/script&#x3E;
+    &#x3C;link href="https://unpkg.com/maplibre-gl@1.15.0/dist/maplibre-gl.css" rel="stylesheet"/&#x3E;
     &#x3C;link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/&#x3E;
     &#x3C;style&#x3E;
         body {
@@ -152,18 +160,18 @@
 &#x3C;/head&#x3E;
 &#x3C;body&#x3E;
     &#x3C;div id='menu'&#x3E;
-        &#x3C;input id='icgc' type='radio' name='rtoggle' value='icgc' checked='checked'&#x3E;
-        &#x3C;label for='icgc'&#x3E;icgc&#x3C;/label&#x3E;
-        &#x3C;input id='osm-bright' type='radio' name='rtoggle' value='osm-bright'&#x3E;
-        &#x3C;label for='osm-bright'&#x3E;osm-bright&#x3C;/label&#x3E;
-        &#x3C;input id='positron' type='radio' name='rtoggle' value='positron'&#x3E;
-        &#x3C;label for='positron'&#x3E;positron&#x3C;/label&#x3E;
-        &#x3C;input id='fulldark' type='radio' name='rtoggle' value='fulldark'&#x3E;
-        &#x3C;label for='fulldark'&#x3E;fulldark&#x3C;/label&#x3E;
-        &#x3C;input id='night' type='radio' name='rtoggle' value='night'&#x3E;
-        &#x3C;label for='night'&#x3E;night&#x3C;/label&#x3E;
-        &#x3C;input id='hibrid' type='radio' name='rtoggle' value='hibrid'&#x3E;
-        &#x3C;label for='hibrid'&#x3E;hibrid&#x3C;/label&#x3E;
+    &#x3C;input id='icgc_mapa_estandard' type='radio' name='rtoggle' value='icgc_mapa_estandard' checked='checked'&#x3E;
+    &#x3C;label for='icgc_mapa_estandard'&#x3E;Mapa estàndard&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_mapa_base_gris' type='radio' name='rtoggle' value='icgc_mapa_base_gris'&#x3E;
+    &#x3C;label for='icgc_mapa_base_gris'&#x3E;Mapa base gris&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_delimitacio_estandard' type='radio' name='rtoggle' value='icgc_delimitacio_estandard'&#x3E;
+    &#x3C;label for='icgc_delimitacio_estandard'&#x3E;Delimitació estàndard&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_xarxa_viaria_estandard' type='radio' name='rtoggle' value='icgc_xarxa_viaria_estandard'&#x3E;
+    &#x3C;label for='icgc_xarxa_viaria_estandard'&#x3E;Xarxa viària estàndard&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_arees_poblament' type='radio' name='rtoggle' value='icgc_arees_poblament'&#x3E;
+    &#x3C;label for='icgc_arees_poblament'&#x3E;Àrees poblament&#x3C;/label&#x3E;&#x3C;br&#x3E;
+    &#x3C;input id='icgc_orto_hibrida' type='radio' name='rtoggle' value='icgc_orto_hibrida'&#x3E;
+    &#x3C;label for='icgc_orto_hibrida'&#x3E;Orto híbrida&#x3C;/label&#x3E;
     &#x3C;/div&#x3E;
     &#x3C;div id='div_pitch' class="mapboxgl-ctrl-group mapboxgl-ctrl"&#x3E;
         &#x3C;button id="bt_pitch" title="Perspectiva" class="mapboxgl-ctrl-icon glyphicon glyphicon-road"&#x3E;&#x3C;/button&#x3E;
@@ -172,7 +180,7 @@
     &#x3C;script type="module"&#x3E;
        const map = new maplibregl.Map({
             container: 'map',
-            style: 'https://geoserveis.icgc.cat/contextmaps/icgc.json',
+            style: 'https://geoserveis.icgc.cat/contextmaps/icgc_mapa_estandard.json',
            center: [1.1464, 41.706],
             zoom: 7.4,
             maxZoom: 14,
@@ -217,4 +225,5 @@
     </div>
   </div>
 </body>
+
 </html>