layerDefaults.tile Object

The default configuration for tile layers.

Example - set default options for all tile layers

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

Example - set default URL template for all tile layers

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

layerDefaults.tile.attribution String

The attribution of all tile layers.

Example - set default attribution for all tile layers

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

layerDefaults.tile.subdomains Array

The subdomain of all tile layers.

Example - set subdomains for all tile layers

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

layerDefaults.tile.opacity Number (default: 1)

The the opacity of all tile layers.

Example - set tile layer default opacity

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