Question

我试图将Control放入现有的div中，但我不知道在哪里或如何强制map.addControl方法显示控件（它是在地图上已经存在的div内的方式绘制控件。我正在使用leaflet draw plugin by the way。

我的HTML看起来像这样：

<div class="tooldiv" ng-controller="ClientState">
   ... 
</div>

tooldiv是应该放置控件的地方。

这是我的传单配置：

var drawnItems = new L.FeatureGroup();
map.addLayer(drawnItems);

var drawControl = new L.Control.Draw({
    position: 'topleft',
    draw: {
        polyline: false,
        polygon: {
            title: 'Draw a sexy polygon!',
            allowIntersection: false,
            drawError: {
                color: '#b00b00',
                timeout: 1000
            },
            shapeOptions: {
                color: '#bada55'
            },
            showArea: true
        },
        circle: false,
        rectangle: false,
        marker: false
    },
    edit: false
});

// Add and remove DrawControl menu when layer is selected/unselected
this.toggle_layer_edit = function(edit_polygon) {
    if (edit_polygon === true) {
        if (draw_control_check === null) {
            draw_control_check = map.addControl(drawControl);
        }
    } else {
        if (draw_control_check !== null) {
            map.removeControl(drawControl);
            draw_control_check = null;
        }
    }
}

在寻找答案的过程中，我意识到它甚至可能无法实现？

Answer 1

我认为你应该尝试覆盖绘图控件的onAdd方法。

这是一些未经测试的伪代码（我不确定原始onAdd方法的赋值和调用是否像这样工作）：

var drawControlOnAdd = drawControl.onAdd;

drawControl.onAdd = function (map) {
    var $toolDiv = angular.element('.tooldiv');

    var originalDiv = drawControlOnAdd(map);
    $toolDiv.html(originalDiv);

    return $toolDiv[0];
}

HTH

传单：如何在自定义（自己的）div中显示绘制控件？

1 个答案: