为 Leaflet 指令重用现有的地图实例答案

【问题标题】：Reuse existing map instance for Leaflet directive为 Leaflet 指令重用现有的地图实例
【发布时间】：2015-10-05 14:47:01
【问题描述】：

我正在尝试将Leaflet Editable functionality 添加到我当前的地图中，该地图是由传单指令创建的。我正在获取 L.map 实例：

leafletData.getMap().then(function(map) {
  // where map is the Leaflet map instance
}

但是，Leaflet 可编辑需要在创建地图时设置editable: true。

那么，有没有办法创建一个 L.map 实例

var map = L.map('map', {editable: true});

然后将其附加到 Leaflet 角度指令？

更新：

我试图给 Leaflet 添加一个钩子

L.Map.addInitHook(function () {
  this.whenReady(function () {
    this.editTools = new L.Editable(this, this.options.editOptions);
    console.log('L.map', this);
  });
}

它成功创建了editTools，但是

map.editTools.startPolyline();

还是不行

【问题讨论】：

标签： leaflet angular-leaflet-directive

【解决方案1】：

您是否尝试将editable: true 添加到您的默认设置中？

angular.extend($scope, {
    defaults: {
        editable: true
    },
    center: {
        lat: 51.505,
        lng: -0.09,
        zoom: 8
    }
});

<leaflet defaults="defaults" lf-center="center" height="480px" width="640px"></leaflet>

【讨论】：

您可以通过检查地图实例的选项对象来验证它是否真的设置：console.log(map.options.editable);
将可编辑属性添加到默认值根本不起作用。我上次尝试更新了问题

【解决方案2】：

对于像我这样的人来说，让现有的地图可编辑

var map = L.map('map', {editable: true});

和

一样

var map = L.map('map');
map.editTools = new L.Editable(map);

【讨论】：