宣传单指令 - 全屏显示png

时间:2016-06-24 12:52:55

标签: angularjs leaflet geojson angular-leaflet-directive

我目前正在开发一个必须在地图上显示geojson数据的项目。

我正在使用leaflet-directive用于AngularJS,它运行正常。

我的地图与geojson数据一起正确显示。

角度控制器

angular.extend($scope, {
    intersection: {
        lat: 50.891,
        lng: 4.258,
        zoom: 14
    },
    defaults: {
        scrollWheelZoom: false
    },
    geojson : {},
    layers: {
        baselayers: {
            xyz: {
                name: 'OpenStreetMap (XYZ)',
                url: 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                type: 'xyz'
            }
        },
        overlays: {}
    }
});

$scope.$watch("intersection.zoom", function(zoom) {
    if(zoom > 17){
        $scope.layers.overlays = {
            wms: {
                name: 'intersectionDraw',
                type: 'wms',
                visible: true,
                url: 'img/map.png'
            }
        }
    };
});

现在我想添加一个功能。当我的缩放达到最大缩放时,我想显示一个png绘图。目前,我的代码正在显示马赛克中的png。我希望这个png能够获得地图的完整高度和宽度,并且只能看到这个。没有必要在此png上进行更多缩放,但如果我缩小,则会再次显示“正常”地图

马赛克PNG enter image description here