leaflet - 传单，使用 geoJson 添加 fitbounds

Question

对 JS 不太满意，我正在尝试在我的项目中添加 Fitbound 功能，但我无法管理。

我也有一些只有 Firefox 的加载问题，所有标记都显示在正确的位置，但地图没有正确加载并且中心不正确。也许我的 JS 代码有问题？请帮忙。

    var obj = {
        lang    : 'en',
    };
    var lat = 52.533642;
    var lon = 9.071749;
    function initMap() {
        var mymap = L.map('map').setView([lat, lon], 14);
        var Wikimedia = L.tileLayer('https://maps.wikimedia.org/osm-intl/{z}/{x}/{y}{r}.png', { attribution: '',
            attribution: '<a href="https://wikimediafoundation.org/wiki/Maps_Terms_of_Use">Wikimedia</a>',
            minZoom: 5,
            maxZoom: 19,
            ext: 'png'
        }).addTo(mymap);
        $.getJSON("markers.php?"+$.param(obj),  function(data){
            L.geoJson(data,{
                pointToLayer: function(feature,latlng){
                    var fontIcon = L.divIcon({
                        html: '<span class="myfont-icon"></span>',
                        iconSize: [30, 10],
                        className: 'icon'
                    });                 

                    var marker = L.marker(latlng,{icon: fontIcon});
                        marker.bindPopup('<h2>'+feature.properties.TITLE+'</h2>' );
                        return marker;
                }
            }).addTo(mymap);
        });
    }
    window.onload = function(){
        initMap();
    };

Answer 1

我认为您需要将 Wikimedia 作为图层添加到地图中。

var Wikimedia = L.tileLayer('https://maps.wikimedia.org/osm-intl/{z}/{x}/{y}{r}.png', 
    { attribution: '',attribution: '<a 
        href="https://wikimediafoundation.org/wiki/Maps_Terms_of_Use">Wikimedia</a>',
        minZoom: 5,
        maxZoom: 19,
        ext: 'png'
    })
var map = L.map('mymap', { layers: [Wikimedia]}).setView([lat, lon], 14);;