Új hozzászólás Aktív témák

  • nevemfel

    senior tag

    válasz kw3v865 #8218 üzenetére

    <!DOCTYPE html>
    <html>
      <head>
        <meta
          name="viewport"
          content="initial-scale=1,maximum-scale=1,user-scalable=no"
        />
        <link rel="stylesheet" href="maplibre-gl.css" />
        <style>
          #map {
            position: absolute;
            top: 0;
            bottom: 0;
            width: 100%;
          }
        </style>
      </head>
      <body>
        <div id="map"></div>
        <script type="module">
            import { Map, GeolocateControl } from './maplibre-gl.js';
            const mapTilerKey = "get_your_own_OpIi9ZULNHzrESv6T2vL";  // https://cloud.maptiler.com/account/keys/
            const map = new Map({
                container: "map",
                style: `https://api.maptiler.com/maps/hybrid/style.json?key=${mapTilerKey}`,
                center: [1, 15],
                zoom: 3
            });
            map.addControl(
                new GeolocateControl({
                    positionOptions: {
                        enableHighAccuracy: true
                    }
                })
            );
        </script>
      </body>
    </html>

    Innen lehúzhatod a css-t: [link]
    Ez meg a js: [link]

    Nem egyszerű megoldás, de ez a lib eléggé friss még. Majd alakul.

Új hozzászólás Aktív témák

Hirdetés