2.7 Afegir capa GeoJSON

Exemple

.addLayerGeoJSON(url,idLayer,options)

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

Codi

<html>
  <head>
    <meta charset="utf-8" />
    <title>Exemple mapicgc-gl-js: Afegir capa</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.TOPO,
          center: [1.001, 41.759],
          zoom: 7.4,
          maxZoom: 19,
          hash: true,
          pitch: 0,
        });

        map.on("load", () => {
          let geojsonLayer = {
            id: "geojsonTest",
            data: {
              type: "Feature",
              geometry: {
                type: "Polygon",
                coordinates: [
                  [
                    [1.3119, 41.489],
                    [1.0119, 41.489],
                    [1.0119, 42.0489],
                    [1.3119, 42.0489],
                  ],
                ],
              },
            },
            type: "fill",
            layout: {},
            paint: {
              "fill-color": "#088",
              "fill-opacity": 0.8,
            },
          };
          let layerPosition = "labels"; // select: 'top', 'lines' or 'labels'
          map.addLayerGeoJSON(geojsonLayer, layerPosition);
        });
      }
      initMap();
    </script>
  </body>
</html>

Posició (position)

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