リーフレット・ディレクティブ - pngフルスクリーン表示

Question

私は現在、ジオジソン・データを地図上に表示する必要があるプロジェクトに取り組んでいます。

私はAngularJSにleaflet-directiveを使用していますが、問題なく動作します。

私のマップはgeojsonデータで正しく表示されます。

アンギュラCONTROLLER

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

Answer 1

L.ImageOverlayを使用してくださいが表示されます。 Leaflet single pictureとhttps://github.com/Leaflet/Leaflet/blob/master/debug/map/image-overlay.html