Back to Devexpress

How to: Add a Mini Map to the Map

wpf-17797-controls-and-libraries-map-control-examples-general-how-to-add-a-mini-map-to-the-map.md

latest2.6 KB
Original Source

How to: Add a Mini Map to the Map

  • Jun 19, 2025

To add a mini map to the map, do the following.

  1. Create a MiniMap object and assign it to the MapControl.MiniMap property.
  2. Add MiniMapLayerBase class descendant object to the MiniMap.Layers collection to display them on the mini map.
  3. Customize the appearance of the mini map. Use the Height , Width and MiniMap.Alignment properties of the MiniMap object.
  4. Configure the mini map’s behavior. To do this, specify the MiniMap.Behavior property.
xaml
<dxm:MapControl.MiniMap>
    <dxm:MiniMap Height="210" Width="280" Alignment="TopRight">
        <dxm:MiniMap.Behavior>
            <dxm:FixedMiniMapBehavior ZoomLevel="3">
                <dxm:FixedMiniMapBehavior.CenterPoint>
                    <dxm:GeoPoint Longitude="146" Latitude="-38"/>
                </dxm:FixedMiniMapBehavior.CenterPoint>
            </dxm:FixedMiniMapBehavior>
        </dxm:MiniMap.Behavior>
        <dxm:MiniMapImageTilesLayer>
            <dxm:BingMapDataProvider BingKey="{Binding Source={StaticResource bingKey}}"/>
        </dxm:MiniMapImageTilesLayer>
        <dxm:MiniMapVectorLayer ShapeFill="Red">
            <dxm:ListSourceDataAdapter DataSource="{Binding Source={StaticResource data}, XPath=Ship}">
                <dxm:ListSourceDataAdapter.ItemSettings>
                    <dxm:MapDotSettings Size="10"/>
                </dxm:ListSourceDataAdapter.ItemSettings>
                <dxm:ListSourceDataAdapter.Mappings>
                    <dxm:MapItemMappingInfo Longitude="Longitude" Latitude="Latitude"/>
                </dxm:ListSourceDataAdapter.Mappings>
            </dxm:ListSourceDataAdapter>
        </dxm:MiniMapVectorLayer>
    </dxm:MiniMap>
</dxm:MapControl.MiniMap>

See Also

How to: Add a Map Control at Design Time

How to: Add a Map Control via XAML

How to: Add a Map Control at Runtime

How to: Customize Navigation Elements