Exemple MapICGC GL JS i model 3D

Veure codi font pantalla completa



<html>
<head>
    <meta charset='utf-8'/>
    <title>Exemple MapICGC GL JS i model 3D</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"/>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.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.ORTO3D,
          center: [2.309, 41.98],
          zoom: 17.2,
          maxZoom: 19,
          hash: true,
          bearing: 45,
      });
      map.on("load", () => {
          map.addFullscreenControl();
          map.addNavigationControl()
          map.addAttributionControl({ compact: true });
          map.addGeolocateControl(
              {
                  positionOptions: {
                      enableHighAccuracy: true,
                  },
                  trackUserLocation: true,
              });


      })
       }
  initMap();

    </script>
</body>
</html>