How to: Customize the Appearance of a Vector Element

Jun 07, 2019

This example shows how to customize the visual representation of a map shape element (MapRectangle).

To change the appearance of a map shape (MapRectangle), use the corresponding appearance properties of the MapShape class (e.g., MapShapeBase.Fill, MapShapeBase.HighlightFill, MapShapeBase.StrokeStyle).

MainWindow.xaml

xaml

<Window x:Class="MapShapeAppearance.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525" 
        xmlns:dxm="http://schemas.devexpress.com/winfx/2008/xaml/map">
    <Grid>
        <dxm:MapControl>
            <dxm:ImageTilesLayer>
                <dxm:ImageTilesLayer.DataProvider>
                    <dxm:OpenStreetMapDataProvider/>
                </dxm:ImageTilesLayer.DataProvider>
            </dxm:ImageTilesLayer>
            <dxm:VectorLayer>
                <!--region #ShapeCustomization-->
                <dxm:MapItemStorage>
                    <dxm:MapRectangle Width="700" Height="700" Location="54,90" 
                                        RadiusX="7" RadiusY="7" Fill="Red" HighlightFill="Orange">
                        <dxm:MapRectangle.HighlightStrokeStyle>
                            <dxm:StrokeStyle Thickness="2" />
                        </dxm:MapRectangle.HighlightStrokeStyle>
                        <dxm:MapRectangle.StrokeStyle>
                            <dxm:StrokeStyle Thickness="2" DashCap="Round" LineJoin="Round" />
                        </dxm:MapRectangle.StrokeStyle>
                    </dxm:MapRectangle>
                </dxm:MapItemStorage>
                <!--endregion #ShapeCustomization-->
            </dxm:VectorLayer>
        </dxm:MapControl>
    </Grid>
</Window>