New to Kendo UI for jQuery? Start a free 30-day trial

LayerDefaults.tile

configuration

The default configuration for tile layers.

layerDefaults.tile

Object

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            tile: {
                opacity: 0.8,
                attribution: "&copy; OpenStreetMap"
            }
        },
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png"
        }]
    });
</script>

layerDefaults.tile.attribution

String

The attribution of all tile layers.

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            tile: {
                attribution: "&copy; OpenStreetMap"
            }
        },
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png"
        }]
    });
</script>

layerDefaults.tile.opacity

Number

The opacity of all tile layers.

Default: 1

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            tile: {
                opacity: 0.5
            }
        },
        layers: [{
            type: "tile",
            urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }]
    });
</script>

layerDefaults.tile.subdomains

Array

The subdomain of all tile layers.

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            tile: {
                subdomains: ["a", "b", "c"]
            }
        },
        layers: [{
            type: "tile",
            urlTemplate: "https://#= subdomain #.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
            attribution: "&copy; OpenStreetMap"
        }]
    });
</script>

layerDefaults.tile.urlTemplate

String

The URL template for tile layers. Template variables:

x - X coordinate of the tile
y - Y coordinate of the tile
zoom - zoom level
subdomain - Subdomain for this tile. See subdomains

<div id="map"></div>
<script>
    $("#map").kendoMap({
        layerDefaults: {
            tile: {
                urlTemplate: "https://a.tile.openstreetmap.org/#= zoom #/#= x #/#= y #.png",
                attribution: "&copy; OpenStreetMap"
            }
        },
        layers: [{
            type: "tile"
        }]
    });
</script>