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

MarkerLayerComponent

Represents the Kendo UI MarkerLayer component for Angular. Displays data as markers on vector shape layers for marker maps.

typescript
@Component({
  selector: 'my-app',
  template: `
    <kendo-map>
      <kendo-map-marker-layer 
        [data]="markerData"
        locationField="location"
        titleField="title"
        shape="pin">
      </kendo-map-marker-layer>
    </kendo-map>
  `
})
export class AppComponent {
  public markerData = [
    { location: [40.7128, -74.0060], title: "New York" }
  ];
}

Selector

kendo-map-marker-layer

Inputs

NameTypeDefaultDescription

data?

any[]

Sets the array of data items for this layer.

locationField?

string

Sets the data item field which contains the marker location. The field should be an array with two numbers — latitude and longitude in decimal degrees.

shape?

string

Sets the default marker shape for data-bound markers. Supported marker shapes are pinTarget and pin. Marker shapes are implemented as CSS classes on the marker element (span.k-marker). For example pinTarget is rendered as k-marker-pin-target.

titleField?

string

Sets the data item field which contains the marker title.

Methods

notifyChanges

Updates the component fields with the specified values and refreshes the Chart.

Use this method when the configuration values cannot be set through the template.

ts
item.notifyChanges({ visible: true });
Parameters

changes

any

An object containing the updated input fields.

In this article
SelectorInputsMethods
Not finding the help you need?
Contact Support