DxMapMarker.MarkerId Property

Specifies the marker identifier.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue("")]
[Parameter]
public string MarkerId { get; set; }

Property Value

Type	Default	Description
String	String.Empty	The marker identifier.

Remarks

Specify the MarkerId property to identify the marker in the MarkerClick event handler. The event’s Marker.MarkerId property returns an identifier or the clicked marker.

<DxMap Provider="MapProvider.Azure"
       Zoom="18"
       Width="950px"
       Height="400px"
       MarkerClick="OnMapMarkerClick" >
    <DxMapApiKeys Azure="@MapApiKeyProvider.GetAzureProviderKey()" />
    <DxMapMarkers>
        <DxMapMarker MarkerId="BusStation" IconUrl="images/bus-station-mark.png" >
            <DxMapMarkerLocation GeoPosition="51.481633,-0.008281" />
        </DxMapMarker>
        <DxMapMarker MarkerId="GiftShop" IconUrl="images/shop-mark.png">
            <DxMapMarkerLocation GeoPosition="51.480889,-0.009259" />
        </DxMapMarker>
    </DxMapMarkers>
    <DxMapRoutes>
        <DxMapRoute Color="red" Weight="9" Mode="MapRouteMode.Walking">
            <DxMapRouteLocations>
                <DxMapRouteLocation GeoPosition="51.481633,-0.008281" />
                <DxMapRouteLocation GeoPosition="51.481186,-0.009107" />
                <DxMapRouteLocation GeoPosition="51.480889,-0.009259" />
            </DxMapRouteLocations>
        </DxMapRoute>
    </DxMapRoutes>
</DxMap>
@code {
    void OnMapMarkerClick(MapMarkerClickEventArgs e) {
        switch(e.Marker.MarkerId) {
            case "BusStation":
                ShowBusStationInformation();
                break;
            case "GiftShop":
                ShowShopInformation();
                break;
        }
    }
    // ...
}

Run Demo: Map Markers