cartodb/Leaflet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add zooming animation support to Path.Canvas layers also.

Browse Source
This commit is contained in:
danzel 2012-06-19 11:12:29 +12:00
parent 0556e73c3f
commit bda2a8a2bc
3 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
dist/leaflet.css vendored
View File

@ -276,14 +276,14 @@ a.leaflet-active {
transition: none;
}
.leaflet-zoom-anim .leaflet-overlay-pane svg, .leaflet-zoom-anim .leaflet-marker-icon, .leaflet-zoom-anim .leaflet-popup, .leaflet-zoom-anim .leaflet-marker-shadow {
.leaflet-zoom-anim .leaflet-overlay-pane svg, .leaflet-zoom-anim .leaflet-overlay-pane canvas, .leaflet-zoom-anim .leaflet-marker-icon, .leaflet-zoom-anim .leaflet-popup, .leaflet-zoom-anim .leaflet-marker-shadow {
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
-moz-transition: -moz-transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
-o-transition: -o-transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
transition: transform 0.25s cubic-bezier(0.25,0.1,0.25,0.75);
}
.leaflet-touching .leaflet-overlay-pane svg, .leaflet-touching .leaflet-marker-icon, .leaflet-touching .leaflet-popup, .leaflet-touching .leaflet-marker-shadow {
.leaflet-touching .leaflet-overlay-pane svg, .leaflet-touching .leaflet-overlay-pane canvas, .leaflet-touching .leaflet-marker-icon, .leaflet-touching .leaflet-popup, .leaflet-touching .leaflet-marker-shadow {
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;

4
src/layer/vector/Path.SVG.js
View File

@ -121,7 +121,7 @@ L.Map.include({
this._panes.overlayPane.appendChild(this._pathRoot);
if (L.Browser.any3d) {
this.on('zoomstart', this._animateSvgZoom);
this.on('zoomstart', this._animatePathZoom);
this.on('zoomend', this._endZoom);
}
this.on('moveend', this._updateSvgViewport);
@ -129,7 +129,7 @@ L.Map.include({
}
},
_animateSvgZoom: function (opt) {
_animatePathZoom: function (opt) {
var centerOffset = this._getNewTopLeftPoint(opt.center).subtract(this._getTopLeftPoint()),
scale = Math.pow(2, opt.zoom - this._zoom),
offset = centerOffset.divideBy(1 - 1 / scale),

8
src/layer/vector/canvas/Path.Canvas.js
View File

@ -119,12 +119,20 @@ L.Map.include((L.Path.SVG && !window.L_PREFER_CANVAS) || !L.Browser.canvas ? {}
this._panes.overlayPane.appendChild(root);
if (L.Browser.any3d) {
this.on('zoomstart', this._animatePathZoom);
this.on('zoomend', this._endZoom);
}
this.on('moveend', this._updateCanvasViewport);
this._updateCanvasViewport();
}
},
_updateCanvasViewport: function () {
if (this._zooming) {
//Don't redraw while zooming. See _updateSvgViewport for more details
return;
}
this._updatePathViewport();
var vp = this._pathViewport,