XAML-Map-Control/SampleApps/WpfApplication/MainWindow.xaml

<Window
    x:Class="WpfApplication.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:map="clr-namespace:MapControl;assembly=MapControl.WPF"
    xmlns:vm="clr-namespace:ViewModel"
    xmlns:local="clr-namespace:WpfApplication"
    Title="XAML MapControl - WPF Test Application" Height="600" Width="800"
    Stylus.IsPressAndHoldEnabled="False">
    <Window.Resources>
        <!--
            TileLayers with OpenStreetMap data.
        -->
        <map:TileLayer x:Key="OpenStreetMap" SourceName="OpenStreetMap"
                       Description="Maps © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://{c}.tile.openstreetmap.org/{z}/{x}/{y}.png"
                       MaxZoomLevel="19"/>
        <map:TileLayer x:Key="OpenCycleMap" SourceName="Thunderforest OpenCycleMap"
                       Description="Maps © [Thunderforest](http://www.thunderforest.com/), Data © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://{c}.tile.thunderforest.com/cycle/{z}/{x}/{y}.png"/>
        <map:TileLayer x:Key="Landscape" SourceName="Thunderforest Landscape"
                       Description="Maps © [Thunderforest](http://www.thunderforest.com/), Data © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://{c}.tile.thunderforest.com/landscape/{z}/{x}/{y}.png"/>
        <map:TileLayer x:Key="Outdoors" SourceName="Thunderforest Outdoors"
                       Description="Maps © [Thunderforest](http://www.thunderforest.com/), Data © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://{c}.tile.thunderforest.com/outdoors/{z}/{x}/{y}.png"/>
        <map:TileLayer x:Key="Transport" SourceName="Thunderforest Transport"
                       Description="Maps © [Thunderforest](http://www.thunderforest.com/), Data © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://{c}.tile.thunderforest.com/transport/{z}/{x}/{y}.png"/>
        <map:TileLayer x:Key="TransportDark" SourceName="Thunderforest Transport Dark"
                       Description="Maps © [Thunderforest](http://www.thunderforest.com/), Data © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://{c}.tile.thunderforest.com/transport-dark/{z}/{x}/{y}.png"
                       Foreground="White" Background="Black"/>
        <map:TileLayer x:Key="MapQuest" SourceName="MapQuest OpenStreetMap"
                       Description="Maps © [MapQuest](http://www.mapquest.com/), Data © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://otile{n}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.jpg"
                       MaxZoomLevel="19"/>
        <map:TileLayer x:Key="Seamarks" SourceName="Seamarks"
                       TileSource="http://tiles.openseamap.org/seamark/{z}/{x}/{y}.png"
                       MinZoomLevel="9" MaxZoomLevel="18"/>

        <!--
            A TileLayer using World OSM WMS, a Web Map Service based on OpenStreetMap data.
            Please contact the provider at http://www.osm-wms.de/ if you intend to use this in an application.
        -->
        <map:TileLayer x:Key="WorldOsm" SourceName="World OSM WMS"
                       Description="[World OSM WMS](http://www.osm-wms.de/) © [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="http://129.206.228.72/cached/osm?SERVICE=WMS&amp;VERSION=1.1.1&amp;REQUEST=GetMap&amp;LAYERS=osm_auto:all&amp;STYLES=&amp;SRS=EPSG:900913&amp;BBOX={W},{S},{E},{N}&amp;WIDTH={X}&amp;HEIGHT={Y}&amp;FORMAT=image/png"/>

        <!--
            Bing Maps TileLayers with tile URLs retrieved from the Imagery Metadata Service
            (see http://msdn.microsoft.com/en-us/library/ff701716.aspx).
            A Bing Maps API Key (see http://msdn.microsoft.com/en-us/library/ff428642.aspx) is required
            for using these layers and must be assigned to the static BingMapsTileLayer.ApiKey property.
        -->
        <map:BingMapsTileLayer x:Key="BingRoad" SourceName="Bing Maps Road"
                               Description="© [Microsoft Corporation](http://www.bing.com/maps/)"
                               Mode="Road" MaxZoomLevel="19"/>
        <map:BingMapsTileLayer x:Key="BingAerial" SourceName="Bing Maps Aerial"
                               Description="© [Microsoft Corporation](http://www.bing.com/maps/)"
                               Mode="Aerial" MaxZoomLevel="19" Foreground="White" Background="Black"/>
        <map:BingMapsTileLayer x:Key="BingHybrid" SourceName="Bing Maps Hybrid"
                               Description="© [Microsoft Corporation](http://www.bing.com/maps/)"
                               Mode="AerialWithLabels" MaxZoomLevel="19" Foreground="White" Background="Black"/>

        <!--
            A TileLayer that uses an ImageTileSource
        -->
        <!--<map:TileLayer x:Key="OsmImageTileSource"
                       Description="© [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)">
            <map:ImageTileSource IsAsync="True" UriFormat="http://{c}.tile.openstreetmap.org/{z}/{x}/{y}.png"/>
        </map:TileLayer>-->

        <!--
            A TileLayer that demonstrates how to access local tile image files (from ImageFileCache here)
        -->
        <!--<map:TileLayer x:Key="OsmLocalFiles"
                       Description="© [OpenStreetMap Contributors](http://www.openstreetmap.org/copyright)"
                       TileSource="file:///C:/ProgramData/MapControl/TileCache/OpenStreetMap/{z}/{x}/{y}.png"/>-->

        <local:LocationToVisibilityConverter x:Key="LocationToVisibilityConverter"/>

        <DataTemplate x:Key="PolylineItemTemplate">
            <map:MapPolyline Locations="{Binding Locations}" Stroke="Red" StrokeThickness="3"/>
        </DataTemplate>

        <Style x:Key="PolylineItemStyle" TargetType="map:MapItem">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="map:MapItem">
                        <map:MapPolyline Locations="{Binding Locations}" Stroke="Red" StrokeThickness="3"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="PointItemStyle" TargetType="map:MapItem">
            <EventSetter Event="TouchDown" Handler="MapItemTouchDown"/>
            <Setter Property="Location" Value="{Binding Location}"/>
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="map:MapItem">
                        <Canvas>
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal"/>
                                    <VisualState x:Name="Disabled"/>
                                    <VisualState x:Name="MouseOver">
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="labelBackground" Storyboard.TargetProperty="Opacity" To="0.7" Duration="0:0:0.1"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="SelectionStates">
                                    <VisualState x:Name="Unselected"/>
                                    <VisualState x:Name="Selected">
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetName="selectedPath" Storyboard.TargetProperty="Opacity" To="0.7" Duration="0:0:0.1"/>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Path x:Name="selectedPath" Fill="White" Opacity="0">
                                <Path.Data>
                                    <EllipseGeometry RadiusX="15" RadiusY="15"/>
                                </Path.Data>
                            </Path>
                            <Path StrokeThickness="2" Fill="Transparent">
                                <Path.Stroke>
                                    <SolidColorBrush Color="Gray"/>
                                </Path.Stroke>
                                <Path.Data>
                                    <EllipseGeometry RadiusX="8" RadiusY="8"/>
                                </Path.Data>
                            </Path>
                            <Grid Canvas.Left="15" Canvas.Top="-8">
                                <Rectangle x:Name="labelBackground" Fill="White" Opacity="0"/>
                                <local:OutlinedText Margin="1" OutlineThickness="1.5" Text="{Binding Name}"/>
                            </Grid>
                        </Canvas>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Panel.ZIndex" Value="1"/>
                </Trigger>
            </Style.Triggers>
        </Style>

        <Style x:Key="PushpinItemStyle" TargetType="map:MapItem">
            <EventSetter Event="TouchDown" Handler="MapItemTouchDown"/>
            <Setter Property="Location" Value="{Binding Location}"/>
            <Setter Property="VerticalAlignment" Value="Bottom"/>
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="Visibility">
                <Setter.Value>
                    <MultiBinding Converter="{StaticResource LocationToVisibilityConverter}">
                        <Binding Path="(map:MapPanel.ParentMap)" RelativeSource="{RelativeSource Self}"/>
                        <Binding Path="RenderTransform" RelativeSource="{RelativeSource Self}"/>
                    </MultiBinding>
                </Setter.Value>
            </Setter>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="map:MapItem">
                        <map:Pushpin Content="{Binding Name}" Foreground="{TemplateBinding Foreground}"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Panel.ZIndex" Value="1"/>
                    <Setter Property="Foreground" Value="OrangeRed"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>

    <Window.DataContext>
        <vm:ViewModel/>
    </Window.DataContext>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <map:Map x:Name="map" ZoomLevel="11" MaxZoomLevel="20" Center="{Binding MapCenter}"
                 TileLayer="{StaticResource OpenStreetMap}"
                 MouseLeftButtonDown="MapMouseLeftButtonDown" MouseRightButtonDown="MapMouseRightButtonDown"
                 MouseMove="MapMouseMove" MouseLeave="MapMouseLeave"
                 ManipulationInertiaStarting="MapManipulationInertiaStarting">

            <!-- experimental WMS map layers -->
            <!--<map:WmsImageLayer ServerUri="http://129.206.228.72/cached/osm" Layers="osm_auto:all"/>-->
            <!--<map:WmsImageLayer ServerUri="http://ows.terrestris.de/osm/service" Layers="OSM-WMS"/>-->

            <map:MapImage x:Name="mapImage" South="53.54031" North="53.74871" West="8.08594" East="8.43750"
                          Source="10_535_330.jpg" Opacity="0.5"/>

            <map:MapGraticule Opacity="0.6"/>
            <map:MapScale Margin="4" Opacity="0.8" HorizontalAlignment="Left" Background="Transparent"/>

            <!-- use ItemTemplate or ItemContainerStyle alternatively -->
            <map:MapItemsControl ItemsSource="{Binding Polylines}"
                                 ItemTemplate="{StaticResource PolylineItemTemplate}"/>
            <!--<map:MapItemsControl ItemsSource="{Binding Polylines}"
                                 ItemContainerStyle="{StaticResource PolylineItemStyle}"/>-->

            <map:MapItemsControl ItemsSource="{Binding Points}"
                                 ItemContainerStyle="{StaticResource PointItemStyle}"
                                 IsSynchronizedWithCurrentItem="True"
                                 SelectionMode="Extended"/>

            <map:MapItemsControl ItemsSource="{Binding Pushpins}"
                                 ItemContainerStyle="{StaticResource PushpinItemStyle}"
                                 IsSynchronizedWithCurrentItem="True"/>

            <Path map:MapPanel.Location="53.5,8.2" Stroke="Blue" StrokeThickness="3" Fill="#1F007F00">
                <Path.Data>
                    <EllipseGeometry RadiusX="1852" RadiusY="1852" Transform="{Binding ScaleTransform, ElementName=map}"/>
                </Path.Data>
            </Path>

            <map:MapPath Stroke="Blue" Fill="Aqua" Opacity="0.5">
                <map:MapPath.Data>
                    <GeometryGroup FillRule="EvenOdd">
                        <EllipseGeometry Center="8.2,63.5" RadiusX="0.025" RadiusY="0.025"/>
                        <EllipseGeometry Center="8.2,63.51" RadiusX="0.015" RadiusY="0.015"/>
                    </GeometryGroup>
                </map:MapPath.Data>
            </map:MapPath>

            <map:Pushpin Location="53.5,8.2" Background="Yellow" Foreground="Blue" Content="N 53° 30' E 8° 12'">
                <map:Pushpin.Visibility>
                    <MultiBinding Converter="{StaticResource LocationToVisibilityConverter}">
                        <Binding Path="(map:MapPanel.ParentMap)" RelativeSource="{RelativeSource Self}"/>
                        <Binding Path="RenderTransform" RelativeSource="{RelativeSource Self}"/>
                    </MultiBinding>
                </map:Pushpin.Visibility>
            </map:Pushpin>
        </map:Map>

        <Border HorizontalAlignment="Right" VerticalAlignment="Bottom" Background="#7FFFFFFF">
            <TextBlock Margin="2" FontSize="10" map:HyperlinkText.InlinesSource="{Binding TileLayer.Description, ElementName=map}"/>
        </Border>

        <Grid Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <TextBlock x:Name="mouseLocation" Margin="5" VerticalAlignment="Bottom" FontFamily="Segoe UI Mono"/>
            <StackPanel Grid.Column="1" Orientation="Horizontal" HorizontalAlignment="Right">
                <StackPanel Margin="5">
                    <TextBlock Text="Zoom Level" Margin="0,0,0,2" HorizontalAlignment="Center" Foreground="Gray" FontSize="10"/>
                    <Slider ToolTip="Zoom Level" Width="100" VerticalAlignment="Center" SmallChange="0.01"
                            Minimum="{Binding MinZoomLevel, ElementName=map}"
                            Maximum="{Binding MaxZoomLevel, ElementName=map}"
                            Value="{Binding TargetZoomLevel, ElementName=map}"/>
                </StackPanel>
                <StackPanel Margin="5">
                    <TextBlock Text="Heading" Margin="0,0,0,2" HorizontalAlignment="Center" Foreground="Gray" FontSize="10"/>
                    <Slider ToolTip="Heading" Width="100" VerticalAlignment="Center" SmallChange="5" LargeChange="45"
                            Minimum="0" Maximum="360" Value="{Binding TargetHeading, ElementName=map}"/>
                </StackPanel>
                <StackPanel Margin="5">
                    <TextBlock Text="Image Opacity" Margin="0,0,0,2" HorizontalAlignment="Center" Foreground="Gray" FontSize="10"/>
                    <Slider ToolTip="Image Opacity" Width="100" VerticalAlignment="Center"
                            Minimum="0" Maximum="1" Value="{Binding Opacity, ElementName=mapImage}"/>
                </StackPanel>
                <CheckBox ToolTip="Seamarks Overlay" Margin="7" VerticalAlignment="Bottom" Content="Seamarks"
                          Checked="SeamarksChecked" Unchecked="SeamarksUnchecked"/>
                <ComboBox ToolTip="Tile Layer" Margin="5" VerticalAlignment="Bottom"
                          SelectedValuePath="Tag" SelectedValue="{Binding TileLayer, ElementName=map, Mode=TwoWay}">
                    <ComboBoxItem Tag="{StaticResource OpenStreetMap}">OpenStreetMap</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource OpenCycleMap}">OpenCycleMap</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource Landscape}">Landscape</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource Outdoors}">Outdoors</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource Transport}">Transport</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource TransportDark}">Transport Dark</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource MapQuest}">MapQuest Open</ComboBoxItem>
                    <!--<ComboBoxItem Tag="{StaticResource WorldOsm}">World OSM WMS</ComboBoxItem>-->
                    <!--<ComboBoxItem Tag="{StaticResource BingRoad}">Bing Maps Road</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource BingAerial}">Bing Maps Aerial</ComboBoxItem>
                    <ComboBoxItem Tag="{StaticResource BingHybrid}">Bing Maps Hybrid</ComboBoxItem>-->
                </ComboBox>
            </StackPanel>
        </Grid>
    </Grid>
</Window>