ui-leaflet
ui-leaflet copied to clipboard
Tiles broken when using the option param
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
:+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">
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
}
}
}