New to Kendo UI for Angular? Start a free 30-day trial
ShapeTooltipTemplateDirective
A directive that sets a template
within the <kendo-map-tooltip>
component for the Map
Shape layer tooltip.
The available inputs for the shape tooltip template are:
dataItem: any
—The original data item used to create the shape.layerIndex: number
—The index of the layer for the tooltip.location: Location
—The location of the center of the shape.
typescript
@Component({
selector: 'my-app',
template: `
<kendo-map>
<kendo-map-layer type="shape" [data]="data">
<kendo-map-shape-layer-tooltip>
<ng-template kendoMapShapeTooltipTemplate let-dataItem="dataItem" let-layerIndex="layerIndex">
<div>Shape: {{ dataItem.properties.name }} (Layer {{ layerIndex }})</div>
</ng-template>
</kendo-map-shape-layer-tooltip>
</kendo-map-layer>
</kendo-map>
`
})
export class AppComponent {
public data = [ ... ]; // GeoJSON data for shapes
}
Selector
[kendoMapShapeTooltipTemplate]