Leaflet 传单.js-在拖动过程中显示移动的矩形

我有一个界面，当拖动地图时，会在地图上绘制一个矩形

我已经通过此创建了此功能的精简版本。用于plunkr的JS如下所示：

var map = new L.Map('leaflet', {
    layers: [
        new L.TileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            'attribution': 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
        })
    ],
    center: [36, -98],
    zoom: 6,
    renderer: L.svg({ padding: 100 })
});

var rectangle = L.rectangle(map.getBounds().pad(-0.1));

map.on("dragstart", function (e) {
  var b = map.getBounds().pad(-0.1);
  rectangle.setBounds(b);
  rectangle.addTo(map);
  map.on("drag", dragEvent);
});

map.on("dragend", function (e) {
  rectangle.removeFrom(map);
  map.off("drag", dragEvent); 
});

map.on("mouseup", function(e){
  console.log("mouseup!");
});

var dragEvent = function(e) {
  rectangle.setBounds(map.getBounds().pad(-0.1));
}

var-map=新的L.map（'传单'{
图层：[
新的L.TileLayer（'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'{
“属性”：“地图数据©贡献者”
})
],
中心：[36，-98]，
缩放：6，
渲染器：L.svg（{padding:100}）
});
var rectangle=L.rectangle（map.getBounds（）.pad（-0.1））；
地图上（“dragstart”，函数（e）{
var b=map.getBounds（）.pad（-0.1）；
矩形.立根（b）；
矩形.addTo（map）；
地图上（“拖动”，dragEvent）；
});
地图上（“地图”，功能（e）{
矩形。从（地图）移除；
地图关闭（“拖动”，dragEvent）；
});
地图上（“鼠标”，功能（e）{
log（“mouseup！”）；
});
var dragEvent=功能（e）{
rectangle.setBounds（map.getBounds（）.pad（-0.1））；
}

这在Chrome和Internet Explorer中似乎可以正常工作。我遇到的问题是Firefox（Windows上的v59.0.2 64位）。在FF中，如果您单击并拖动地图，并在将鼠标悬停在矩形上时释放鼠标按钮，则似乎缺少

mouseup

事件。这意味着，如果将鼠标悬停在plunkr右侧的工具栏上，在单击工具栏上的某个位置之前，将不会看到预期的悬停行为

那么，我的问题是：

是否有更好的方法实现此功能

如果没有，有人知道为什么FF会出现这种情况吗

在FF中，如果单击并拖动贴图，并在将鼠标悬停在矩形上时释放鼠标按钮，则似乎缺少mouseup事件

虽然看起来不太好，但在setTimeout中包装矩形的移除将解决此问题：

map.on("dragend", function (e) {
  setTimeout(function() {
    rectangle.removeFrom(map);
  }, 1);
  map.off("drag"); 
});

另一个解决方案是为矩形创建自己的mouseup处理程序：

map.on("dragend", function (e) {
  map.off("drag"); 
});

map.on("mouseup", function(e) {
  rectangle.removeFrom(map);
});

rectangle.on("mouseup", function (e) {
  rectangle.removeFrom(map);
  L.DomEvent.stopPropagation(e);
});

---

另外，可能有理由在

上打开一个问题setTimeout工作得很出色，谢谢！既然我有了Plunkr aleady，我想我会提出一个问题。