Salta el contingut

2.14 Fetch dades

Exemple

.fetchData(url,idLayer,options)

📌 Format de dades: geojson o flatgeobuf

See the Pen Exemple fetchData by unitatgeostart (@unitatgeostart) on CodePen.

CodePen

Codi

<html>
  <head>
    <meta charset="utf-8" />
    <title>Exemple mapicgc-gl-js: Fetch dades</title>
    <meta
      name="viewport"
      content="initial-scale=1,maximum-scale=1,user-scalable=no"
    />
    <script src="https://eines.icgc.cat/recursos/mapicgc-gl-js/mapicgc-gl.js"></script>
    <link
      href="https://eines.icgc.cat/recursos/mapicgc-gl-js/mapicgc-gl.css"
      rel="stylesheet"
    />

    <style>
      body {
        margin: 0;
        padding: 0;
      }
      #map {
        position: absolute;
        top: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>


    <script>
      async function initMap() {
        const data = await mapicgcgl.Config.getConfigICGC();
        const map = new mapicgcgl.Map({
          container: "map",
          style: data.Styles.LIGHT,
          center: [1.808, 41.618],
          zoom: 10,
          maxZoom: 19,
          hash: true,
          pitch: 0,
        });
        let paintOptions = {
          layout: {
            visibility: "visible",
          },
          paint: {
            "line-color": "green",
            "line-width": 3,
            "line-opacity": 1,
          },
          layerPosition: "top", // select: 'top', 'lines' or 'labels'
        };
        let paintOptionsfgb = {
          type: "line",
          layout: {
            visibility: "visible",
          },
          paint: {
            "line-color": "grey",
            "line-width": 2,
          },
          layerPosition: "top", // select: 'top', 'lines' or 'labels'
        };

        map.on("load", () => {
          map.fetchData(
            data.Layers.FGBAdmin.comarquesVigent,
            "Comarques",
            paintOptionsfgb
          );

          map.fetchData(
            "https://analisi.transparenciacatalunya.cat/resource/pzaa-n72w.geojson",
            "RutesMontserrat",
            paintOptions
          );
          // try with FGB data:

          // map.fetchData(
          //     "https://flatgeobuf.org/test/data/UScounties.fgb",
          //     "UScounties", paintOptionsfgb
          // );
        });
      }
      initMap();
    </script>
  </body>
</html>

Posició (layerPosition)

id Descripció
'top' Posició de la capa per sobre de tots els elements carregats prèviament
'labels' Posició de la capa per sota de tots els elements de tipus etiqueta carregats prèviament
'lines' Posició de la capa per sota de tots els elements de tipus línia, punt i etiqueta carregats prèviament

Capes FGB ICGC

Layers.FGBAdmin.{id}

id
agrupacionsCensalsVigent
agrupacionsCensalsVigentText
areesBasiquesPolicialsVigent
areesBasiquesPolicialsVigent2023
areesBasiquesPolicialsVigent2023Text
areesBasiquesPolicialsVigent2024
areesBasiquesPolicialsVigent2024Text
areesBasiquesPolicialsVigentText
areesBasiquesSalutVigent
areesBasiquesServeisSocialsVigent
areesBasiquesServeisSocialsVigentText
areesGestioAssistencialVigent
areesHidrogeologiquesAquifersVigent
catalunyaVigent
catalunyaVigentText
comarquesVigent
comarquesVigentText
comarquesVigents
comarquesVigentsText
districtesCensalsVigent
districtesCensalsVigentText
espaisNaturalsEnpeVigent
espaisNaturalsEnpeVigentText
espaisNaturalsPeinVigent
espaisNaturalsPeinVigentText
incendisForestalsVigent
incendisForestalsVigentText
municipisVigent
municipisVigentText
partitsJudicialsVigent
partitsJudicialsVigentText
plaTerritorialVigent
plaTerritorialVigentText
provinciesVigent
provinciesVigentText
provinciesVigents
provinciesVigentsText
regionsPolicialsVigent
regionsPolicialsVigentText
regionsSanitariesVigent
regionsSanitariesVigentText
seccionsCensalsVigent
seccionsCensalsVigentText
sectorsSanitarisVigent
vegueriesVigent
vegueriesVigentText