リーフレットの地図

Question

リーフレットで動く地図パンをドラッグするのと同じように、ズームするのではなく、同じ方法でスクロールするようにしました。スクロール・イベントや設定センターを聞いて、より高レベルのDOM APIを使ってこれを行うことができましたが、それは良い気分もなく、マップをドラッグすることの滑らかさにも匹敵しませんでした。ドラッグするだけでスムーズに感じるスクロールで地図を移動する方法はありますか？

Answer 1

ズームの代わりにマップパンを実行するようにL.Map.ScrollWheelZoomハンドラを適応させることができます。

L.Map.ScrollWheelPan = L.Map.ScrollWheelZoom.extend({ 
    _performZoom: function() { 
    var map = this._map, 
     delta = this._delta; 

    map.stop(); // stop panning and fly animations if any 

    delta = delta > 0 ? Math.ceil(delta) : Math.floor(delta); 
    delta = Math.max(Math.min(delta, 4), -4); 

    this._delta = 0; 
    this._startTime = null; 

    if (!delta) { 
     return; 
    } 

    map.panBy([0, -delta * 40]); // Adjust 40 to your feeling. 
    } 
}); 

L.Map.addInitHook('addHandler', 'scrollWheelPan', L.Map.ScrollWheelPan); 

var map = L.map("map", { 
    scrollWheelZoom: false, 
    scrollWheelPan: true 
}); 

デモ：https://jsfiddle.net/3v7hd2vx/67/