Javascript 传单地图不';不要总是将同一WMS瓷砖层加载到中心位置

Javascript 传单地图不';不要总是将同一WMS瓷砖层加载到中心位置,javascript,maps,leaflet,coordinates,wms,Javascript,Maps,Leaflet,Coordinates,Wms,我正在开发一个应用程序,使用离子框架和AngularJS以及传单JS库 当我第一次加载贴图时,它将正确居中显示 但是,当我切换到应用程序的另一个视图并返回地图视图时,WMS平铺层显示为从中心偏移,只能看到地图左上角的一小部分 这里是创建地图并加载WMS平铺层的代码片段: function crearPlano($scope, $http, infoService, sharedProperties, poisService, createModal) { var building =

我正在开发一个应用程序,使用离子框架和AngularJS以及传单JS库

当我第一次加载贴图时,它将正确居中显示

但是,当我切换到应用程序的另一个视图并返回地图视图时,WMS平铺层显示为从中心偏移,只能看到地图左上角的一小部分

这里是创建地图并加载WMS平铺层的代码片段:

function crearPlano($scope, $http, infoService, sharedProperties, poisService, createModal) {

    var building = localStorage.building,
        floor = localStorage.planta,
        floor_id = building + floor,
        building_id = floor_id.replace(/\./g,"_").toLowerCase();

    var parameters = 
    [
        'proyecto/ows',
        'service=WFS',
        'version=1.0.0',
        'request=GetFeature',
        'typeName=proyecto:'+building_id,
        'srsName=epsg:4326',
        'outputFormat=application/json'
    ]
    var url = APP_CONSTANTS.URI_Geoserver_1 + 'proyecto/ows?' + parameters.join('&');

    $.ajax({
        url : url,
        type: 'GET',
        dataType : 'json',
        crossDomain: true,
        headers: { 'Access-Control-Allow-Origin': '*' },
        success: function(data) {
            handleJson(data, sharedProperties, poisService, createModal, function(map){
                sharedProperties.setMap(map);
            });
        }
    });

    function handleJson(data, floor_id, sharedProperties, poisService, createModal, callback) {
        console.log("handleJson", data, floor_id);
        var map = sharedProperties.getMap(),
            coordinates = data.features[0].geometry.coordinates[0][0][0],
            floorCoordinates = new L.latLng(coordinates[1], coordinates[0]);

        //Remove previous plan layers
        if(!(typeof map == 'undefined')) { map.remove(); }

        var imageLayer = new L.tileLayer.wms(APP_CONSTANTS.URI_Geoserver_2 + "sigeuz/wms", 
        {
            layers: 'sigeuz:vista_plantas',
            maxZoom: 25,
            zIndex: 5,
            viewparams : 'PLANTA:'+floor_id,
            format: 'image/png', transparent: true, attribution: floor_id
        });

        console.log("Before create map  -->  Center", JSON.stringify(floorCoordinates));
        console.log("Before create map  -->  MaxBounds", JSON.stringify(L.geoJson(data).getBounds()));

        map= new L.map('plan'
            ,{
                crs: L.CRS.EPSG3857,
                layers: [imageLayer]
            }
        ).setView(floorCoordinates, 20);

        console.log("After create map  -->  Center", JSON.stringify(plano.getCenter()));
        console.log("After create map  -->  Bounds", JSON.stringify(plano.getBounds()));

        callback(map);
    }
}
为什么地图加载仅在第一次居中,但在第二次居中后会发生位移

我在代码中添加了一些控制台日志,以便调试作为参数传递给映射创建的数据以及映射创建后的数据。通过这种方式,我可以比较前面描述的两种情况下是否发生了变化。结果是:

Before create map  -->  Center {"lat":41.64063807836347,"lng":-0.90146666131869}
Before create map  -->  MaxBounds {"_southWest":{"lat":41.64061302810611,"lng":-0.9015017606364195},"_northEast":{"lat":41.64079735418267,"lng":-0.9012732012812255}}

After create map  -->  Center {"lat":41.6406381751715,"lng":-0.9014656782889374}
After create map  -->  Bounds {"_southWest":{"lat":41.64032848115259,"lng":-0.9017432869219788},"_northEast":{"lat":41.640947867702096,"lng":-0.9011880696558963}}


Before create map  -->  Center {"lat":41.64063807836347,"lng":-0.90146666131869}
Before create map  -->  MaxBounds {"_southWest":{"lat":41.64061302810611,"lng":-0.9015017606364195},"_northEast":{"lat":41.64079735418267,"lng":-0.9012732012812255}}

After create map  -->  Center {"lat":41.64063807836347,"lng":-0.90146666131869}
After create map  -->  Bounds {"_southWest":{"lat":41.640637639043334,"lng":-0.9014663100242616},"_northEast":{"lat":41.640637639043334,"lng":-0.9014663100242616}}
可以看出,在这两种情况下,作为地图创建的中心点和最大边界传递的数据是相同的,但一旦创建了地图,地图的中心坐标和边界与第一种情况和第二种情况略有不同


我不太明白它为什么会改变。

每次地图容器可能改变大小时都运行。这包括通过jquery、ionic等隐藏/显示它。

每次地图容器可能更改大小时运行。这包括通过jquery、ionic等隐藏/显示它。

这似乎不起作用,WMS平铺层仍不居中似乎不起作用,WMS平铺层仍不居中