Skip to content

PAN loop with maxBounds #1908

@C-Moreira

Description

@C-Moreira

Hello.

I have a PAN loop when using maxBounds on map.
If I set maxBounds and zoom all the way to see the full map I get a PAN loop.
This happens for v0.6.4 and not for v0.5.1
To check the issue in v0.6 go to http://jsfiddle.net/8QHFe/642/
To see the same map in v0.5 without issue go to http://jsfiddle.net/8QHFe/644/

I have a fix changing function panInsideBounds so that if the view is larger than the map the map gets centered.

The code is:

panInsideBounds: function (bounds) {
    bounds = L.latLngBounds(bounds);

    var viewBounds = this.getPixelBounds(),
        viewSw = viewBounds.getBottomLeft(),
        viewNe = viewBounds.getTopRight(),
        sw = this.project(bounds.getSouthWest()),
        ne = this.project(bounds.getNorthEast()),
        viewCenter = L.bounds(viewSw, viewNe).getCenter(),
        boundsCenter = L.bounds(sw, ne).getCenter(),
        dx = 0,
        dy = 0;

    if (viewSw.y-viewNe.y > sw.y-ne.y) { // center vertical
        dy = boundsCenter.y-viewCenter.y;
    } else if (viewNe.y < ne.y) { // north
        dy = Math.ceil(ne.y - viewNe.y);
    } else if (viewSw.y > sw.y) { // south
        dy = Math.floor(sw.y - viewSw.y);
    }
    if (viewNe.x-viewSw.x > ne.x-sw.x) { // center horizontal
        dx = boundsCenter.x-viewCenter.x;
    } else if (viewNe.x > ne.x) { // east
        dx = Math.floor(ne.x - viewNe.x);
    } else if (viewSw.x < sw.x) { // west
        dx = Math.ceil(sw.x - viewSw.x);
    }

    if (dx || dy) {
        return this.panBy([dx, dy]);
    }

    return this;
},

Don't know if this is the best way to go.
Could some developer check this?
Thanks

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions