Skip to main content
All docs
V25.1
  • DxMapMarker Class

    Contains a map marker’s settings.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    public class DxMapMarker :
        DxComplexSettingsComponent<DxMapMarker, MapMarkerModel>,
        IModelProvider<MapMarkerTooltipModel>,
        IModelProvider<MapLocationModel>

    Remarks

    To create a map marker, follow the steps below:

    1. Place a DxMapMarker component in the DxMapMarkers collection.
    2. Add a DxMapMarkerLocation object and specify a marker location. You can use either the GeoPosition property or Latitude and Longitude properties.
    3. Add a DxMapMarkerTooltip object to specify a tooltip for the marker. Use the Text property to specify the tooltip text and the Visible property to specify the initial tooltip visibility.
    <DxMap Zoom="14" Provider="MapProvider.Azure" Width="950px" Height="400px" >
        <DxMapApiKeys Azure="@MapApiKeyProvider.GetAzureProviderKey()" />
        <DxMapMarkers>
            <DxMapMarker>
                <DxMapMarkerLocation GeoPosition="51.519852,-0.077593" />
                <DxMapMarkerTooltip Text="Spitalfields Market" Visible="true" />
            </DxMapMarker>
            <DxMapMarker>
                <DxMapMarkerLocation GeoPosition="51.514763,-0.080787" />
                <DxMapMarkerTooltip Text="The Gherkin" Visible="true" />
            </DxMapMarker>
            <DxMapMarker>
                <DxMapMarkerLocation GeoPosition="51.508029,-0.078674" />
                <DxMapMarkerTooltip Text="Tower of London" Visible="true" />
            </DxMapMarker> 
        </DxMapMarkers>
    </DxMap>
    

    Map - Tooltips

    Run Demo: Map Markers

    Inheritance

    Object
    ComponentBase
    DxSettingsComponent<DevExpress.Blazor.ClientComponents.Internal.MapMarkerModel>
    DxComplexSettingsComponent<DxMapMarker, DevExpress.Blazor.ClientComponents.Internal.MapMarkerModel>
    DxMapMarker
    See Also