# Map Layers Overview

The information that the Map renders is organized into layers.

## Layer Types

The Map supports the following layer types:

<Row>
  <Column count={[24,24,12]} style={{marginBottom: "1rem"}}>
    <Component className="tile" href="/map/layers/tile">
      <ComponentTitle>Tile Map Layer</ComponentTitle>
      <ComponentDescription style={{padding: "0 10px 10px 10px"}}>Display raster map tiles from services like OpenStreetMap or Bing Maps.</ComponentDescription>
    </Component>
  </Column>
  <Column count={[24,24,12]} style={{marginBottom: "1rem"}}>
    <Component className="tile" href="/map/layers/shape">
      <ComponentTitle>Shape Layer (GeoJSON Vector Map)</ComponentTitle>
      <ComponentDescription style={{padding: "0 10px 10px 10px"}}>Render vector shapes from GeoJSON data for custom geographic boundaries.</ComponentDescription>
    </Component>
  </Column>
  <Column count={[24,24,12]} style={{marginBottom: "1rem"}}>
    <Component className="tile" href="/map/layers/bubble">
      <ComponentTitle>Bubble Map Layer</ComponentTitle>
      <ComponentDescription style={{padding: "0 10px 10px 10px"}}>Visualize data with proportional bubbles at specific geographic coordinates.</ComponentDescription>
    </Component>
  </Column>
  <Column count={[24,24,12]} style={{marginBottom: "1rem"}}>
    <Component className="tile" href="/map/layers/marker">
      <ComponentTitle>Marker Layer</ComponentTitle>
      <ComponentDescription style={{padding: "0 10px 10px 10px"}}>Place markers at specific locations with customizable icons and tooltips.</ComponentDescription>
    </Component>
  </Column>
</Row>

## Layer Ordering

These layers are stacked by type, regardless of declaration order. The default order is:

* Tile layer
* Shape layer(s)
* Bubble layer(s)
* Marker layer(s)

The order can be changed by setting a `zIndex` on each layers. The following example demonstrates how to place a Bubble layer on top of a Shape layer using z-index.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/map/layers/zindex/source.txt)

## Suggested Links

* [Tile Layer](https://www.telerik.com/kendo-angular-ui/components/map/layers/tile)
* [Shape Layer (GeoJSON)](https://www.telerik.com/kendo-angular-ui/components/map/layers/shape)
* [Bubble Map Layer](https://www.telerik.com/kendo-angular-ui/components/map/layers/bubble)
* [Marker Layer](https://www.telerik.com/kendo-angular-ui/components/map/layers/marker)
* [API Index of the Map](https://www.telerik.com/kendo-angular-ui/components/map/api)
