使用setView设置地图的适当大小

时间:2018-11-02 16:34:53

标签: javascript leaflet

我正在尝试使用Leaflet插件制作静态地图。我已经准备了一个1024x768的地图,并为静态地图进行了一些设置。我的setView有问题-我无法使其正确显示我的地图。这是我的代码:

#mapid 
{
    height: 768px;
    width: 1024px;
}
<!doctype html>
<html>
    <head>
        <title>Gothic 3 Map</title>
        <meta charset="utf-8">


        <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css"
   integrity="sha512-puBpdR0798OZvTTbP4A8Ix/l+A4dHDD0DGqYW6RQ+9jxkRFclaxxQb/SJAWZfWAkuyeQUytO7+7N4QKrDh+drA=="
   crossorigin=""/>
 <script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"
   integrity="sha512-nMMmRyTVoLYqjP9hrbed9S+FzjZHW5gY1TWCHA5ckwXZBadntCNs8kEqAWdrb9O7rxbCaA4lKTIWjDXZxflOcA=="
   crossorigin=""></script>

        <link rel="stylesheet" type="text/css" href="style.css">
    </head>
    <body>
        <div id="mapid" ></div>
            <script>
                
                var mymap = L.map('mapid', {
                    dragging: false,
                    zoomControl: false,
                    touchZoom: false,
                    doubleClickZoom: false,
                    scrollWheelZoom: false
                }).setView([0,0], 0);

                L.tileLayer('https://vignette.wikia.nocookie.net/gothic/images/a/a6/Mapa_Myrtany_%28Gothic_3%29.jpg/revision/latest?cb=20080816123521&path-prefix=pl', {
                minZoom: 0,
                id: 'myrtana'
                }).addTo(mymap);
                
                document.getElementsByClassName( 'leaflet-control-attribution' )[0].style.display = 'none';
                document.getElementsByClassName( 'leaflet-top' )[0].style.display = 'none';

                var marker = L.marker([0, 0]).addTo(mymap);
            </script>
    </body>
</html>

我只想使此地图适合此灰色矩形。

0 个答案:

没有答案