Edit this page

Zoom Modes

The RadMap allows the user to zoom in and zoom out the content of the map. This is done via the Zoom Bar control in the Commands Bar panel. By clicking on the button with an icon representing a magnifier, the user is provided with different options to zoom in and zoom out. The main tool is the slider which allows the user to slide between the maximum and minimum zoom level. Together with the slider there are several zoom presets, which represent different ranges from the slider.

To change the zoom level programmatically you can change the value of the ZoomLevel property of the RadMap.

To disable the mouse wheel zooming just set the IsMouseWheelZoomEnabled property to False.

You are able to modify the preset Labels like this:


public MainPage()
    this.radMap.InitializeCompleted += new EventHandler(radMap_InitializeCompleted);
private void radMap_InitializeCompleted(object sender, EventArgs e)
    this.SetCustomZoomLevelLabel(18, "My Level");

private void SetCustomZoomLevelLabel(int zoomLevel, string label)
    CommandDescription description = (from cmd in this.radMap.MapZoomBar.Commands
                                      where (int)cmd.CommandParameter == zoomLevel
                                      select cmd).FirstOrDefault();
    if (description != null)
        RoutedUICommand command = description.Command as RoutedUICommand;
        if (command != null)
            command.Text = label;


Public Sub New()
    AddHandler radMap.InitializeCompleted, AddressOf radMap_InitializeCompleted
End Sub

Private Sub radMap_InitializeCompleted(ByVal sender As Object, ByVal e As EventArgs)
      Me.SetCustomZoomLevelLabel(18, "My Level")
End Sub

Private Sub SetCustomZoomLevelLabel(ByVal zoomLevel As Integer, ByVal label As String)
      Dim description As CommandDescription = (
          From cmd In Me.radMap.MapZoomBar.Commands
          Where CInt(Fix(cmd.CommandParameter)) = zoomLevel
          Select cmd).FirstOrDefault()
      If description IsNot Nothing Then
            Dim command As RoutedUICommand = TryCast(description.Command, RoutedUICommand)
            If command IsNot Nothing Then
                  command.Text = label
            End If
      End If
End Sub

Here is a snapshot of the result.

To disable the user from zooming, set the ZoomBarVisibility property of the RadMap to Collapsed. Additionally you have to disable the default zooming performed on double click or mouse wheel. To do this, set he MouseDoubleClickMode to None and the IsMouseWheelZoomEnabled to False.


<telerik:RadMap x:Name="radMap"

Note that the UI control is represented by the MapZoomBar 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 ZoomBarVisibility 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 read here.

In order to use the MapZoomBar outside the RadMap you have to set its MapControl property to the respective RadMap instance. Here is an example:


<StackPanel Orientation="Horizontal">
    <telerik:MapZoomBar MapControl="{Binding ElementName=radMap}"
                        VerticalAlignment="Top" />
    <telerik:RadMap x:Name="radMap"
                    Height="480" VerticalAlignment="Top"

The snapshot of the result:

See Also