loleaflet/src/layer/tile/CanvasTileLayer.js | 20 ++++++++++++++++----
loleaflet/src/layer/tile/GridLayer.js | 2 +-
loleaflet/src/map/anim/Map.ZoomAnimation.js | 4 ++--
loleaflet/src/map/handler/Map.TouchGesture.js | 4 ++--
4 files changed, 21 insertions(+), 9 deletions(-)
New commits:
commit b7295e51e2a3a6a82e359eaf107a7819935ea0ce
Author: Jan Holesovsky <ke...@collabora.com>
AuthorDate: Thu Sep 10 00:03:10 2020 +0200
Commit: Jan Holesovsky <ke...@collabora.com>
CommitDate: Thu Sep 10 00:09:35 2020 +0200
calc canvas: Zoom during the pinch-to-zoom too.
Set the canvas' scale and translate back so that the zoom happens in the
middle of the pinch. Also change some getZoom() calls to accessing the
map's _zoom directly, because the getZoom()'s value depend on whether we
are in the middle of the animation or not.
Change-Id: Iced7d67e49044c901a2c21496d9d12dbe718207b
diff --git a/loleaflet/src/layer/tile/CanvasTileLayer.js
b/loleaflet/src/layer/tile/CanvasTileLayer.js
index e60042334..d035f6ee9 100644
--- a/loleaflet/src/layer/tile/CanvasTileLayer.js
+++ b/loleaflet/src/layer/tile/CanvasTileLayer.js
@@ -182,7 +182,13 @@ L.CanvasTilePainter = L.Class.extend({
// when using the pinch to zoom, set additional
translation based */
// on the pinch movement
+ var scale = 1;
if (this._map._animatingZoom) {
+ // set the canvas' scale according to the
pinch-to-zoom
+ this._canvasCtx.save();
+ scale =
this._map.getZoomScale(this._map._animateToZoom, this._lastZoom);
+ this._canvasCtx.scale(scale, scale);
+
var centerOffset =
this._map._getCenterOffset(this._map._animateToCenter);
paneOffset.x += Math.round(centerOffset.x);
paneOffset.y += Math.round(centerOffset.y);
@@ -202,14 +208,19 @@ L.CanvasTilePainter = L.Class.extend({
crop.min.x - tileBounds.min.x,
crop.min.y - tileBounds.min.y,
cropWidth, cropHeight,
- crop.min.x - paneOffset.x,
- crop.min.y - paneOffset.y,
+ (crop.min.x - paneOffset.x) /
scale,
+ (crop.min.y - paneOffset.y) /
scale,
cropWidth, cropHeight);
if (this._layer._debug)
{
this._canvasCtx.strokeStyle = 'rgba(255, 0, 0,
0.5)';
this._canvasCtx.strokeRect(tile.coords.x,
tile.coords.y, 256, 256);
}
+
+ if (this._map._animatingZoom) {
+ // we have set a scale, restore the state
+ this._canvasCtx.restore();
+ }
}
},
@@ -432,12 +443,13 @@ L.CanvasTileLayer = L.TileLayer.extend({
movestart: this._moveStart,
moveend: this._move,
// update tiles on move, but not more often than once
per given interval
- move: L.Util.throttle(this._move,
this.options.updateInterval, this), // TODO we might want to make the updates
more often (?)
+ move: L.Util.throttle(this._move,
this.options.updateInterval, this),
splitposchanged: this._move,
};
if (this._zoomAnimated) {
- events.zoomanim = L.Util.throttle(this._animateZoom,
this.options.updateInterval, this); // TODO we might want to make the updates
more often (?)
+ // update tiles on zoom, but not more often than once
per given interval
+ events.zoomanim = L.Util.throttle(this._animateZoom,
this.options.updateInterval, this);
}
return events;
diff --git a/loleaflet/src/layer/tile/GridLayer.js
b/loleaflet/src/layer/tile/GridLayer.js
index 4ad07d8fa..4eaeb2f45 100644
--- a/loleaflet/src/layer/tile/GridLayer.js
+++ b/loleaflet/src/layer/tile/GridLayer.js
@@ -12,7 +12,7 @@ L.GridLayer = L.Layer.extend({
opacity: 1,
updateWhenIdle: (window.mode.isMobile() ||
window.mode.isTablet()),
- updateInterval: 200,
+ updateInterval: 50, // 20x per second should be hopefully enough
attribution: null,
zIndex: null,
diff --git a/loleaflet/src/map/anim/Map.ZoomAnimation.js
b/loleaflet/src/map/anim/Map.ZoomAnimation.js
index 0a8a23133..e365f4b39 100644
--- a/loleaflet/src/map/anim/Map.ZoomAnimation.js
+++ b/loleaflet/src/map/anim/Map.ZoomAnimation.js
@@ -100,8 +100,8 @@ L.Map.include(!zoomAnimated ? {} : {
L.DomUtil.addClass(this._mapPane, 'leaflet-zoom-anim');
} else if (endAnim) {
- // explicitly end the zoom
- this._animatingZoom = false;
+ // explicitly end the zoom & redraw
+ this._onZoomTransitionEnd();
}
this.fire('zoomanim', {
diff --git a/loleaflet/src/map/handler/Map.TouchGesture.js
b/loleaflet/src/map/handler/Map.TouchGesture.js
index 6e74651be..b7bfad7b9 100644
--- a/loleaflet/src/map/handler/Map.TouchGesture.js
+++ b/loleaflet/src/map/handler/Map.TouchGesture.js
@@ -543,7 +543,7 @@ L.Map.TouchGesture = L.Handler.extend({
// we need to invert the offset or the map is moved in the
opposite direction
var offset = {x: e.center.x - this._pinchStartCenter.x, y:
e.center.y - this._pinchStartCenter.y};
var center = {x: this._pinchStartCenter.x - offset.x, y:
this._pinchStartCenter.y - offset.y};
- this._zoom =
this._map._limitZoom(this._map.getScaleZoom(e.scale));
+ this._zoom =
this._map._limitZoom(this._map.getScaleZoom(e.scale, this._map._zoom));
this._center =
this._map._limitCenter(this._map.mouseEventToLatLng({clientX: center.x,
clientY: center.y}),
this._zoom,
this._map.options.maxBounds);
@@ -555,7 +555,7 @@ L.Map.TouchGesture = L.Handler.extend({
},
_onPinchEnd: function () {
- var oldZoom = this._map.getZoom(),
+ var oldZoom = this._map._zoom,
zoomDelta = this._zoom - oldZoom,
finalZoom = this._map._limitZoom(zoomDelta > 0 ?
Math.ceil(this._zoom) : Math.floor(this._zoom));
_______________________________________________
Libreoffice-commits mailing list
libreoffice-comm...@lists.freedesktop.org
https://lists.freedesktop.org/mailman/listinfo/libreoffice-commits
