| | |
| | | var scaleX = usableWidth / contentWidth |
| | | var scaleY = usableHeight / contentHeight |
| | | var scale = Math.min(scaleX, scaleY, 1.7) |
| | | var zoomPercent = Math.max(60, Math.min(220, Math.floor(scale * 100))) |
| | | var zoomPercent = Math.max(1, Math.min(220, Math.floor(scale * 100))) |
| | | var centerX = (bounds.minX + bounds.maxX) / 2 |
| | | var centerY = (bounds.minY + bounds.maxY) / 2 |
| | | this.mapZoomPercent = zoomPercent |
| | |
| | | if (zoomPercent == null) { |
| | | return |
| | | } |
| | | zoomPercent = Math.max(60, Math.min(220, zoomPercent)) |
| | | zoomPercent = Math.max(1, Math.min(220, zoomPercent)) |
| | | if (!wrap || !this.mapContext.width || !this.mapContext.height) { |
| | | this.mapZoomPercent = zoomPercent |
| | | return |
| | |
| | | if (!this.mapContext.nodes.length) { |
| | | return |
| | | } |
| | | if (event.ctrlKey || event.metaKey) { |
| | | var wrap = this.$refs.mapCanvasWrap |
| | | if (!wrap) { |
| | | return |
| | | } |
| | | var rect = wrap.getBoundingClientRect() |
| | | var delta = event.deltaY < 0 ? 10 : -10 |
| | | var nextPercent = Math.max(60, Math.min(220, this.mapZoomPercent + delta)) |
| | | this.setMapZoomAroundPoint(nextPercent, event.clientX - rect.left, event.clientY - rect.top) |
| | | var wrap = this.$refs.mapCanvasWrap |
| | | if (!wrap) { |
| | | return |
| | | } |
| | | this.mapPanX -= event.deltaX |
| | | this.mapPanY -= event.deltaY |
| | | var wheelDelta = Math.abs(event.deltaY) >= Math.abs(event.deltaX) ? event.deltaY : event.deltaX |
| | | if (!wheelDelta) { |
| | | return |
| | | } |
| | | var rect = wrap.getBoundingClientRect() |
| | | var delta = wheelDelta < 0 ? 10 : -10 |
| | | var nextPercent = Math.max(1, Math.min(220, this.mapZoomPercent + delta)) |
| | | this.setMapZoomAroundPoint(nextPercent, event.clientX - rect.left, event.clientY - rect.top) |
| | | }, |
| | | beginMapDrag: function (event) { |
| | | var wrap = this.$refs.mapCanvasWrap |