Navigation

When working with the RadMap control, the user would likely try to pan or zoom the map using mouse and/or keyboard or using the map navigation control. The developer is also able to implement outside navigation using the RadMap's API or to just predefine a start location. To do this you can use the following properties:

• Center—Represents the center point of the map view and is of type Location.
• ZoomLevel—Represents different levels of detail available on the map. The maximum level of available detail is determined by the location you are zooming into, for example some areas can be zoomed in further than other areas.

By default each change of the current map location is animated. The animation is controlled via the UseSpringAnimations property with default value of True. If you want to disable the animation simply set it to False.

If you want to hide the navigation control you have to set the NaviagtionVisibility to Collapsed.

Example 1

<dataVisualization:RadMap x:Name="radMap" 
                NavigationVisibility="Collapsed"> 
</dataVisualization:RadMap> 

If you want to disable the user from zooming and panning, you have to set the following properties:

Example 2

<dataVisualization:RadMap x:Name="radMap" 
                MapZoomMode="None" 
                NavigationVisibility="Collapsed" 
                IsKeyboardNavigationEnabled="False" 
                MouseClickMode="None" 
                MouseDoubleClickMode="None" 
                MouseDragMode="None" 
                ZoomBarVisibility="Collapsed"> 
</dataVisualization:RadMap> 

Additionally as the UI navigation control is represented by the MapNavigation control, you are able to use it outside the RadMap and place it somewhere around it. In this case you have to either hide the original one by using the NavigationVisibility property of the RadMap or the UseDefaultLayout one.

Setting the UseDefaultLayout property to False will hide all of the UI controls inside the RadMap. To learn more click here.

In order to use the MapNavigation outside of the RadMap you have to set its MapControl property to the respective RadMap instance. Additionally you can handle its CenterButtonClick event and implement your custom logic in the event handler. Here is an example:

Example 1

<Grid Width="800" Height="500" > 
    <dataVisualization:RadMap x:Name="radMap" 
                            NavigationVisibility="Collapsed" 
                            IsKeyboardNavigationEnabled="False" 
                            MouseClickMode="None" 
                            MouseDoubleClickMode="None" 
                            MouseDragMode="None" 
                            ZoomBarVisibility="Collapsed"> 
        <dataVisualization:RadMap.Providers> 
            <telerikMap:OpenStreetMapProvider APIKey="Your API Key" StandardModeUserAgent="Your User Agent"/> 
        </dataVisualization:RadMap.Providers> 
    </dataVisualization:RadMap> 
    <Grid Background="Bisque" HorizontalAlignment="Right"> 
        <telerikMap:MapNavigation MapControl="{Binding ElementName=radMap}" VerticalAlignment="Center" 
            Margin="10"  BorderThickness="2" HorizontalAlignment="Right" /> 
    </Grid>                        
</Grid> 

See Also

• Click Modes
• Zoom Modes
• Distance and Scale
• Mouse Location
• Default Layout