Edit this page

extent

Gets or sets the map extent or visible area. The setter is chainable, i.e. returns the map instance.

Parameters

extent kendo.dataviz.map.ExtentThe new extent of the map.

Returnskendo.dataviz.map.Extent The current map extent.

Example - get the map extent

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

    var map = $("#map").data("kendoMap");
    var extent = map.extent();

    alert("North West corner: " + extent.nw.toString());
</script>

Example - set the map extent to show Australia

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

    var aus = new kendo.dataviz.map.Extent(
      [-10.683333, 113.155],   // North West location
      [-39.138889, 153.638889] // South East location
    );

    $("#map").getKendoMap().extent(aus);
  </script>
Is this article helpful? Yes / No
Thank you for your feedback!

Give article feedback

Tell us how we can improve this article

close
Dummy