[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
 [Expand]What's Installed
 [Expand].NET Core 3 Support
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Collapse]Map Control
   [Expand]Getting Started
   [Expand]Coordinate Systems
   [Expand]Map Image Data
   [Expand]GIS Data
   [Expand]Vector Data
   [Expand]Visual Elements
   [Collapse]End-User Interaction
     Printing and Exporting
     Scrolling and Zooming
     Vector Item Editor
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Data Editors
  [Expand]Navigation Controls
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Scrolling and Zooming

You can use zooming and scrolling to navigate on a map.

Expanded Scrolling a Map

The Map control allows scrolling by default. You can enable/disable scrolling using the MapControl.EnableScrolling property.

The code above uses the following classes and properties:

Class or Property Description
MapControl.EnableScrolling Specifies whether scrolling is enabled/disabled.
MapControl.ScrollButtonsOptions Gets or sets scroll buttons' options.
ScrollButtonsOptions Stores scroll buttons' options.
MapElementOptions.Visible Specifies scroll buttons' visibility.

After scrolling is enabled, the map can be scrolled as follows:

  • Hover a mouse pointer over a map. Click and hold the left mouse button and drag it in the required direction.
  • Use Scroll Buttons. You can scroll the map in the four directions by clicking the navigation panel's arrows.

  • Scroll a map using flick gestures on touchscreen devices.
  • Use the MapControl.Scroll method to programmatically scroll a map by a specified offset. The MapControl.CanScroll method checks if the offset is valid.

Expanded How to: Enable Circular Scrolling

You can scroll a map endlessly by enabling the Circular Scrolling option. This functionality can be used in maps that have a geographical coordinate system.

The following example shows how to enable Circular Scrolling:

Use the following classes and properties to enable circular scrolling:

Class or Property Description
MapControl.CoordinateSystem Gets or sets a map's coordinate system.
GeoMapCoordinateSystem The Map control's Geographical coordinate system.
GeoMapCoordinateSystem.CircularScrollingMode Specifies which map items can be circularly scrolled.
CircularScrollingMode Lists values that indicate items that should be circularly scrolled.

Note that, a map shape should fulfill the following condition to cross the 180th meridian: one or several points' longitudes should exceed the 180 (-180) limit:

The code above produces the following image:

Expanded Zooming a Map

The zooming functionality is available in the Map control by default. You can enable/disable zooming in maps using the MapControl.EnableZooming property:

You can also use the following classes and properties to configure zooming options:

Class or Property Description
MapControl.MaxZoomLevel Gets or sets the Map control's maximum zoom level.
MapControl.MinZoomLevel Specifies the Map control's minimum zoom level.
LayerBase.MaxZoomLevel Gets or sets the map layer's maximum zoom level.
LayerBase.MinZoomLevel Specifies the map layer's minimum zoom level.
MapControl.MouseWheelZoomingStep Specifies the zooming step when the zooming using the mouse wheel.
MapControl.ZoomTrackbarOptions Gets or sets the Zoom Trackbar's settings.
ZoomTrackbarOptions Stores the Zoom Trackbar's settings.

You can zoom a map as follows:

Expanded How to: Zoom to a Specified Region

The following example shows how to zoom a rectangular area specified by two geographical points:

The code above uses the following classes and properties:

Class or Property Description
MapControl.ZoomToRegion Zooms a map to a rectangular region specified by its top-left and bottom-right points.
MapControl.ZoomToRegionBehavior Specifies the Zoom to Region-related settings.
ZoomToRegionBehavior The Zoom to Region behavior settings.

Expanded See Also

Is this topic helpful?​​​​​​​