使用自定义控件时，Leaflet-Draw标记无法正常工作

Question

我正在使用Leaflet Draw，我创建了一个自定义控件而不是默认控件。

在我的自定义控件中，除标记外，一切正常（折线，多边形，圆形和矩形）。
当我点击Marker菜单项时，标记会立即放在菜单后面的位置，而不是让我选择将其拖动到地图上并选择位置（参见下面的错误与预期的对比）。

我该如何解决这个问题？

HTML code：

<div class="btn-group">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
           <i class="fa fa-pencil"></i> Drawing tools <span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
            <li><a href="#" onclick="draw('polyline')">Line</a></li>
            <li><a href="#" onclick="draw('polygon')">Polygon</a></li>
            <li><a href="#" onclick="draw('rectangle')">Rectangle</a></li>
            <li><a href="#" onclick="draw('circle')">Circle</a></li>
            <li><a href="#" onclick="draw('marker')">Marker</a></li>
        </ul>
</div>

Javascript功能：

function draw(type) {

    var po = '';
    switch(type) {
        case 'polygon':
            po = new L.Draw.Polygon(map);
            break;
        case 'polyline':
            po = new L.Draw.Polyline(map);
            break;
        case 'rectangle':
            po = new L.Draw.Rectangle(map);
            break;
        case 'circle':
            po = new L.Draw.Circle(map);
            break;
        case 'marker':
            po = new L.Draw.Marker(map);
            break;
    }
    po.enable();
}

谢谢，抱歉我的英语不好！

Answer 1

请尝试以下标记

po = new L.Draw.Marker(map, { draggable : true});

Answer 2

使用stopPropagation：

解决了这个问题

HTML code：

<div class="btn-group">
        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
           <i class="fa fa-pencil"></i> Drawing tools <span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
            <li><a href="#" class="draw-tool" data-draw='polyline'>Line</a></li>
            <li><a href="#" class="draw-tool" data-draw='polygon'>Polygon</a></li>
            <li><a href="#" class="draw-tool" data-draw='rectangle'>Rectangle</a></li>
            <li><a href="#" class="draw-tool" data-draw='circle'>Circle</a></li>
            <li><a href="#" class="draw-tool" data-draw='marker'>Marker</a></li>
        </ul>
</div>

Javascript功能：

$(function() {
    $('.draw-tool').click(function(e) {
        var type = $(this).attr('data-draw');
        if (type === 'marker') {
            e.stopPropagation();
        }
        draw(type);
    })
}); 

function draw(type) {

    var po = '';
    switch(type) {
        case 'polygon':
            po = new L.Draw.Polygon(map);
            break;
        case 'polyline':
            po = new L.Draw.Polyline(map);
            break;
        case 'rectangle':
            po = new L.Draw.Rectangle(map);
            break;
        case 'circle':
            po = new L.Draw.Circle(map);
            break;
        case 'marker':
            po = new L.Draw.Marker(map);
            break;
    }
    po.enable();
}