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 | 1 1 50 50 50 50 1 1 | /* * L.Handler.ShiftDragZoom is used to add shift-drag zoom interaction to the map * (zoom to a selected bounding box), enabled by default. */ L.Map.mergeOptions({ boxZoom: true }); L.Map.BoxZoom = L.Handler.extend({ initialize: function (map) { this._map = map; this._container = map._container; this._pane = map._panes.overlayPane; }, addHooks: function () { L.DomEvent.on(this._container, 'mousedown', this._onMouseDown, this); }, removeHooks: function () { L.DomEvent.off(this._container, 'mousedown', this._onMouseDown); }, _onMouseDown: function (e) { Eif (!e.shiftKey || ((e.which !== 1) && (e.button !== 1))) { return false; } L.DomUtil.disableTextSelection(); this._startLayerPoint = this._map.mouseEventToLayerPoint(e); this._box = L.DomUtil.create('div', 'leaflet-zoom-box', this._pane); L.DomUtil.setPosition(this._box, this._startLayerPoint); //TODO refactor: move cursor to styles this._container.style.cursor = 'crosshair'; L.DomEvent .on(document, 'mousemove', this._onMouseMove, this) .on(document, 'mouseup', this._onMouseUp, this) .on(document, 'keydown', this._onKeyDown, this) .preventDefault(e); this._map.fire("boxzoomstart"); }, _onMouseMove: function (e) { var startPoint = this._startLayerPoint, box = this._box, layerPoint = this._map.mouseEventToLayerPoint(e), offset = layerPoint.subtract(startPoint), newPos = new L.Point( Math.min(layerPoint.x, startPoint.x), Math.min(layerPoint.y, startPoint.y)); L.DomUtil.setPosition(box, newPos); // TODO refactor: remove hardcoded 4 pixels box.style.width = (Math.max(0, Math.abs(offset.x) - 4)) + 'px'; box.style.height = (Math.max(0, Math.abs(offset.y) - 4)) + 'px'; }, _finish: function () { this._pane.removeChild(this._box); this._container.style.cursor = ''; L.DomUtil.enableTextSelection(); L.DomEvent .off(document, 'mousemove', this._onMouseMove) .off(document, 'mouseup', this._onMouseUp) .off(document, 'keydown', this._onKeyDown); }, _onMouseUp: function (e) { this._finish(); var map = this._map, layerPoint = map.mouseEventToLayerPoint(e); if (this._startLayerPoint.equals(layerPoint)) { return; } var bounds = new L.LatLngBounds( map.layerPointToLatLng(this._startLayerPoint), map.layerPointToLatLng(layerPoint)); map.fitBounds(bounds); map.fire("boxzoomend", { boxZoomBounds: bounds }); }, _onKeyDown: function (e) { if (e.keyCode === 27) { this._finish(); } } }); L.Map.addInitHook('addHandler', 'boxZoom', L.Map.BoxZoom); |