forked from mutsuyuki/Leaflet.SmoothWheelZoom
-
Notifications
You must be signed in to change notification settings - Fork 0
/
SmoothWheelZoom.js
109 lines (82 loc) · 3.42 KB
/
SmoothWheelZoom.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
L.Map.mergeOptions({
// @section Mousewheel options
// @option smoothWheelZoom: Boolean|String = true
// Whether the map can be zoomed by using the mouse wheel. If passed `'center'`,
// it will zoom to the center of the view regardless of where the mouse was.
smoothWheelZoom: true,
// @option smoothWheelZoom: number = 1
// setting zoom speed
smoothSensitivity:1
});
L.Map.SmoothWheelZoom = L.Handler.extend({
addHooks: function () {
L.DomEvent.on(this._map._container, 'wheel', this._onWheelScroll, this);
},
removeHooks: function () {
L.DomEvent.off(this._map._container, 'wheel', this._onWheelScroll, this);
},
_onWheelScroll: function (e) {
if (!this._isWheeling) {
this._onWheelStart(e);
}
this._onWheeling(e);
},
_onWheelStart: function (e) {
var map = this._map;
this._isWheeling = true;
this._wheelMousePosition = map.mouseEventToContainerPoint(e);
this._centerPoint = map.getSize()._divideBy(2);
this._startLatLng = map.containerPointToLatLng(this._centerPoint);
this._wheelStartLatLng = map.containerPointToLatLng(this._wheelMousePosition);
this._startZoom = map.getZoom();
this._moved = false;
this._zooming = true;
map._stop();
if (map._panAnim) map._panAnim.stop();
this._goalZoom = map.getZoom();
this._prevCenter = map.getCenter();
this._prevZoom = map.getZoom();
this._zoomAnimationId = requestAnimationFrame(this._updateWheelZoom.bind(this));
},
_onWheeling: function (e) {
var map = this._map;
this._goalZoom = this._goalZoom + L.DomEvent.getWheelDelta(e) * 0.003 * map.options.smoothSensitivity;
if (this._goalZoom < map.getMinZoom() || this._goalZoom > map.getMaxZoom()) {
this._goalZoom = map._limitZoom(this._goalZoom);
}
this._wheelMousePosition = this._map.mouseEventToContainerPoint(e);
clearTimeout(this._timeoutId);
this._timeoutId = setTimeout(this._onWheelEnd.bind(this), 200);
L.DomEvent.preventDefault(e);
L.DomEvent.stopPropagation(e);
},
_onWheelEnd: function (e) {
this._isWheeling = false;
cancelAnimationFrame(this._zoomAnimationId);
this._map._moveEnd(true);
},
_updateWheelZoom: function () {
var map = this._map;
if ((!map.getCenter().equals(this._prevCenter)) || map.getZoom() != this._prevZoom)
return;
this._zoom = map.getZoom() + (this._goalZoom - map.getZoom()) * 0.3;
this._zoom = Math.floor(this._zoom * 100) / 100;
var delta = this._wheelMousePosition.subtract(this._centerPoint);
if (delta.x === 0 && delta.y === 0)
return;
if (map.options.smoothWheelZoom === 'center') {
this._center = this._startLatLng;
} else {
this._center = map.unproject(map.project(this._wheelStartLatLng, this._zoom).subtract(delta), this._zoom);
}
if (!this._moved) {
map._moveStart(true, false);
this._moved = true;
}
map._move(this._center, this._zoom);
this._prevCenter = map.getCenter();
this._prevZoom = map.getZoom();
this._zoomAnimationId = requestAnimationFrame(this._updateWheelZoom.bind(this));
}
});
L.Map.addInitHook('addHandler', 'smoothWheelZoom', L.Map.SmoothWheelZoom );