New to Kendo UI for AngularStart a free 30-day trial

Shape Layer

Overview

The Map Shape layer displays vector maps encoded in the industry-standard GeoJSON format.

Binding to GeoJSON Data

The following example demonstrates how to bind a Shape layer to GeoJSON data:

Change Theme
Theme
Loading ...

Customizing Shapes

The layer is rendered using the Drawing API and can be customized.

The following example demonstrates how the set the shape color in the shapeCreatedEvent

Change Theme
Theme
Loading ...

Tooltips

The Map has a built-in tooltip for shapes. To display the tooltip, define a shape tooltip template.

The available inputs for the shape tooltip template are:

  • dataItem—The original data item used to create the shape.
  • location—The location of the center of the shape.

The shape tooltip is demonstrated in the example below:

Change Theme
Theme
Loading ...