ui-leaflet icon indicating copy to clipboard operation
ui-leaflet copied to clipboard

Tiles broken when using the option param

Open nmccready opened this issue 8 years ago • 2 comments

From @Onefox on October 14, 2015 16:40

When i am using my own handled map container the tiles are where they should be, but when iam using the option param than the tiles are broken.

This is my working code in the controller (than i get only the error because the directive tries to put another map in there)

var map = L.map('map').setView([0, 0], 2);
        L.tileLayer('altis2/{z}/{x}/{y}.png', {
            minZoom: 1,
            maxZoom: 7,
            attribution: 'ESO/INAF-VST/OmegaCAM',
            tms: true,
            noWrap: true
        }).addTo(map);

And this is the code with using the option param that is not working right.

$scope.defaults ={
            tileLayer: 'altis2/{z}/{x}/{y}.png',
            minZoom: 0,
            maxZoom: 7,
            tms: true,
            noWrap: true
        };
        $scope.center = {
            lat: 0,
            lng: 0,
            zoom: 2
        };

Both are with <leaflet id="map" tiles="tiles" defaults="defaults" center="center" ></leaflet>

And here are the screenshots of the broken parts: http://imgur.com/a/DSlZo

So there must be a difference how the L.titleLayer is working and how the tileLayer option is working. Cheers,

Copied from original issue: tombatossals/angular-leaflet-directive#992

nmccready avatar Nov 02 '15 15:11 nmccready

:+1: same here, tms: true works when adding the layer dynamically using the promise returned by leafletData.getMap() but not when setting $scope.layers with <leaflet layers="layers">

bugdanov avatar Sep 16 '16 01:09 bugdanov

It appears (here: https://github.com/angular-ui/ui-leaflet/blob/7d8dd2f1a5c90334f8b04790b6fe03e550aa4653/src/services/leafletLayerHelpers.js#L447) that you can specify tms:true in layerOptions, eg:

baselayers: {
        myTiles: {
            name: 'My Tiles',
            url: '//{s}.tileserver/{z}/{x}/{y}.png',
            type: 'xyz',
            layerOptions: {
              tms: true
            }
        }
}

bugdanov avatar Sep 16 '16 01:09 bugdanov