Back to Devexpress

DxMapRoutes Class

blazor-devexpress-dot-blazor-4c4f1222.md

latest3.2 KB
Original Source

DxMapRoutes Class

Contains a collection of routes shown on the map.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
public class DxMapRoutes :
    CollectionComponent<MapRouteModel>

Remarks

Place DxMapRoute objects in the DxMapRoutes tag to create routes in the map.

razor
<DxMap Zoom="15" Provider="MapProvider.Azure" Width="950px" Height="500px" >
    <DxMapApiKeys Azure="@MapApiKeyProvider.GetAzureProviderKey()" />
    <DxMapRoutes>
        <DxMapRoute Color="coral" Weight="9" Mode="MapRouteMode.Walking" >
            <DxMapRouteLocations>
                <DxMapRouteLocation GeoPosition="51.519852,-0.077593" />
                <DxMapRouteLocation GeoPosition="51.514763,-0.080787" />
                <DxMapRouteLocation Latitude="51.512471" Longitude="-0.082368" />
                <DxMapRouteLocation Latitude="51.512785" Longitude="-0.083530" />
                <DxMapRouteLocation GeoPosition="51.510974,-0.083612" />
                <DxMapRouteLocation GeoPosition="51.509727,-0.0825166" />
                <DxMapRouteLocation GeoPosition="51.508029,-0.078674" />
            </DxMapRouteLocations>
        </DxMapRoute>
    </DxMapRoutes>
    <DxMapMarkers>
        <DxMapMarker>
            <DxMapMarkerLocation GeoPosition="51.519852,-0.077593" />
            <DxMapMarkerTooltip Text="Spitalfields Market" />
        </DxMapMarker>
        <DxMapMarker>
            <DxMapMarkerLocation GeoPosition="51.514763,-0.080787" />
            <DxMapMarkerTooltip Text="The Gherkin" />
        </DxMapMarker>
        <DxMapMarker>
            <DxMapMarkerLocation GeoPosition="51.510974,-0.083612" />
            <DxMapMarkerTooltip Text="Sky Garden" />
        </DxMapMarker>
        <DxMapMarker>
            <DxMapMarkerLocation GeoPosition="51.509727,-0.0825166" />
            <DxMapMarkerTooltip Text="St Dunstan-in-the-East" />
        </DxMapMarker>
        <DxMapMarker>
            <DxMapMarkerLocation GeoPosition="51.508029,-0.078674" />
            <DxMapMarkerTooltip Text="Tower of London" />
        </DxMapMarker>
    </DxMapMarkers>
</DxMap>

Run Demo: Map Routes

Implements

IComponent

IHandleEvent

IHandleAfterRender

IDisposable

Inheritance

Object ComponentBase DevExpress.Blazor.ClientComponents.Internal.CollectionComponent<DevExpress.Blazor.ClientComponents.Internal.MapRouteModel> DxMapRoutes

See Also

DxMapRoutes Members

DevExpress.Blazor Namespace