[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
  Prerequisites
 [Expand]What's Installed
 [Expand].NET Core 3 Support
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
   Reporting
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Collapse]Map Control
   [Expand]Getting Started
    Layers
   [Expand]Coordinate Systems
   [Expand]Map Image Data
   [Expand]GIS Data
   [Expand]Vector Data
   [Expand]Visual Elements
   [Collapse]End-User Interaction
     Highlighting
     Selection
     Tooltips
     Printing and Exporting
     Scrolling and Zooming
     Vector Item Editor
   [Expand]Examples
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Printing-Exporting
  [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
 [Expand]Localization
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Vector Item Editor

The Map Control's Map Editor allows you to customize Vector Items. Note that the Editor can edit items from all vector layers:

This topic explains how to configure the Map Editor.

Expanded How to: Enable the Map Editor

The Map Editor allows end users to add, remove, and modify Vector Items. Use the following code to enable the Map Editor:

The code above utilizes the following classes and properties:

Symbol Description
MapControl.MapEditor Gets or sets the Map Control's Vector Item Editor.
MapEditor The Vector Item Editor.
MapEditor.ActiveLayer Gets or sets the layer that stores all items changed by the Map Editor.
Note

The Map Control automatically shows the built-in Editor Panel when the Editor is assigned to the control.

Expanded How to: Customize the Map Editor Panel

The Map Editor provides the Editor Panel that allows end users manage the Editor's mode and editing settings.

The Editor Panel looks as follows:

The Panel displays the following icon that switches the Editor's modes:

Panel Icon Description
Cancels the last action.
Restores the last canceled action.
Enables the Default mode.
Enables the Transform mode.
Enables the Edit mode.
Enables the Create mode with Pushpin settings assigned to it.
Enables the Create mode with Polygon settings assigned to it.
Enables the Create mode with Polyline settings assigned to it.
Enables the Create mode with Dot settings assigned to it.
Enables the Create mode with Ellipse settings assigned to it.
Enables the Create mode with Rectangle settings assigned to it.
Enables the Create mode with Line settings assigned to it.

The markup below demonstrates how to configure the Panel:

The example uses classes and properties represented below:

Symbol Description
MapEditor.EditorPanelOptions Gets or sets an object that configures how the Editor Panel looks and behaves.
MapEditorPanelOptions The Map Editor Panel options storage.

Expanded How to: Manage Map Editor Modes

The Map Editor supports four modes that allow the Editor to apply different changes. Sections below describe these modes' capabilities and API:

Default Mode

The default mode is "read-only" and disables editing. The icon on the built-in Editor Panel enables this mode.

The markup below sets the Editor to this mode at design time:

The code above uses the following properties:

Symbol Description
MapEditor.Mode Gets or sets the mode that the Map Editor currently uses.
Note

The Editor's mode can be reset to Default at runtime using the MapEditor.ResetModeCommand command. Refer to the How to: Implement a Custom UI using the Map Editor API section for more information about the Editor's commands.

Transform Mode

The Transform mode provides the capability to resize, move and rotate the Editor's active items.

The icon on the built-in Editor Panel enables the Transform mode:

The markup below translates the Editor to this mode at design time:

The code above uses the properties below:

Symbol Description
MapEditor.Mode Gets or sets the mode that the Map Editor currently uses.
MapEditorTransformMode The Map Editor's mode that allows you to move, resize, and rotate map items.
MapEditorTransformMode.Transform Gets or sets the value that specifies transformations that an end user can apply to the Editor's active items.
Note

The Editor's mode can be set to Transform at runtime using the MapEditor.SetTransformModeCommand command. Refer to the How to: Implement a Custom UI using the Map Editor API section to learn more about the Editor's commands.

Note that several map item types do not support the rotate and resize transformations. The following table lists transformations available for each map item type:

Map Item Translate Resize Rotate
MapPushpin Yes
MapCustomElement Yes
MapDot Yes Yes
MapLine Yes Yes Yes
MapEllipse Yes Yes
MapRectangle Yes Yes
MapPolyline Yes Yes Yes
MapPolygon Yes Yes Yes
MapPath Yes Yes Yes
MapBubble Yes
MapPie Yes
Important

Several map items form a group of active items when they are selected simultaneously. Transformations available for this group are transformations that are available for the less changeable item. For example, when the MapPushpin and MapPath are selected, the Editor allows end-users to move them.

Edit Mode

This mode allows end users to add, move, and delete points that define a map shape.

To enable the Edit mode, click the icon on the built-in Editor Panel. The following table represents actions available in this mode:

Action

Example

Description

Add a vertex

To add a new vertex, hover the mouse pointer between two points over the item's edge and click.

Move a vertex

Drag an existing point to a new position to relocate it.

Delete a vertex

Double click a vertex to remove it.

The markup below translates the Editor to this mode at design time:

The code above uses the following properties:

Symbol Description
MapEditor.Mode Gets or sets the mode that the Map Editor currently uses.
MapEditorEditMode The Map Editor's mode that allows end users to add, remove, and edit coordinates of a map shape's points.
Note

The current Editor's mode can be set to Edit at runtime using the MapEditor.SetEditModeCommand command. Refer to the How to: Implement a Custom UI using the Map Editor API section to learn more about the Editor's commands.

Important

Only MapPolyline, MapPolygon, MapPath and MapLine (only relocating the line's existing points) are available for edit in the Edit mode.

Create Mode

The Create mode provides the capability to add a new map item to the active map layer.

The following built-in Editor Panel's icons allow you to enable the mode: , , , , , or .

The Editor uses mouse actions like click or drag over the Map to create a new map item:

The markup below translates the Editor to this mode at design time:

The code above uses the following properties and classes:

Symbol Description
MapEditor.Mode Gets or sets the mode that the Map Editor currently uses.
MapEditorCreateMode The Map Editor's mode in which end users can add new map items.
MapEditorCreateMode.MapItemSettings Gets or sets an object that configures map items that end users can create.
MapItemSettingsBase The base class for all map items settings classes.
Note

The Editor's mode can be set to Create at runtime using the MapEditor.SetCreateModeCommand command. Refer to the How to: Implement a Custom UI using the Map Editor API section to learn more about the Editor's commands.

Expanded How to: Implement a Custom UI Using the Map Editor API

The Map Editor's API allows you to implement a custom UI:

The following code utilizes the Editor's API:

The table below list all the available commands:

Command

Description

Command Parameter

MapEditor.ResetModeCommand

Returns the command that switches the Editor to the Default mode.

None

MapEditor.SetTransformModeCommand

Returns the command that switches the Editor to the Transform mode.

MapItemTransform: allowed transformations.

MapEditor.SetEditModeCommand

Returns the command that switches the Editor to the Edit mode.

None

MapEditor.SetCreateModeCommand

Returns the command that switches the Editor to the Create mode.

MapItemSettingsBase: a new item's type and the item's default configuration.

MapEditor.TranslateItemsCommand

Returns the command that translates the Editor's actual items.

System.Windows.Vector: active items' horizontal and vertical offset.

MapEditor.ScaleItemsCommand

Returns the command that scales the Editor's Active Items.

System.Windows.Point: horizontal and vertical scaling factors on which the Editor scales active items.

MapEditor.RotateItemsCommand

Returns the command that rotates the Editor's active items.

System.Double: the angle (in degrees) the Editor rotates the group of active items relative to the group's center.

MapEditor.RemoveItemsCommand

Returns the command that removes the Editor's active items from the map.

None

MapEditor.UndoCommand

Returns the command that cancels the last action.

None

MapEditor.RedoCommand

Returns the command that restores the last canceled action.

None

MapEditor.ClearSavedActionsCommand

Returns the command that clears Editor command manager's saved command list.

None

In addition to commands, the Map Editor provides methods that allow you to customize map items in more detail than commands:

Note

Use the MapEditor.ActiveItems property to get items an end user selected.

Method Description
MapEditor.ClearSavedActions Clears the saved action history.
MapEditor.CreateItem Creates an item with the specified settings at the specified point.
MapEditor.TranslateItems Translates specified items at the specified offset.
MapEditor.RotateItems Rotates the Editor's active items by the specified angle.
MapEditor.ScaleItems Scales the specified map items.
MapEditor.InsertItemPoint Inserts a point into the specified item.
MapEditor.RemoveItemPoint Removes a point with the specified index from the specified item's contour with the specified index.
MapEditor.UpdateItemPoint Moves a specified point to the new position.

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