Question

Leaflet贴图的默认行为是仅使用鼠标向下拖动视图。我只想在按下空格键的情况下启用鼠标拖动。我需要在没有空格键的情况下拖动鼠标来执行其他操作，而不是拖动视图。我想使用它来选择实体，例如在Windows桌面上，您可以通过鼠标拖动来选择文件。

我希望获得有关如何实现此行为的帮助：）

Answer 1

当按下空格键时，此示例将能够拖动。对于仅使用鼠标进行拖动，您需要配置其库。或编写一些脚本来修改鼠标拖动事件。希望这会有所帮助。

// Initialize leaflet map
var map = L.map('map').setView([40.7128, -74.0060], 7);
var googleTile = L.tileLayer('http://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}',{
   maxZoom: 20,
   subdomains:['mt0','mt1','mt2','mt3'],
   attribution: ''
}).addTo(map);
// Disable map dragging event (default)
map.dragging.disable();
// Keydown and keyup event
document.body.onkeydown = function(e){
    if(e.keyCode == 32){
        map.dragging.enable();
    }
}
document.body.onkeyup = function(e){
    if(e.keyCode == 32){
        map.dragging.disable();
    }
}

#map { width: 300px; height: 150px; }

<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"></script>
<strong>Press your 'spacebar' key to drag</strong>
<div id="map"></div>

如何仅在按住空格键的情况下才在Leaflet中启用地图拖动？

1 个答案: