An object that specifies configuration options for the dxVectorMap widget.
An object specifying options for the map areas.
The map areas usually represent geographical objects, such as countries, continents, etc. The appearance of these areas is specified by the options of the areaSettings configuration object. If these options are defined on the first level of the areaSettings object, they are applied to all the map areas at once. However, you can specify several of these options for certain areas exclusively. See the customize option description to learn how.
Specifies the options for the map background.
The map background is a space on a map that does not contain areas. Within the background configuration object you can specify colors for the map background and its border.
Specifies the positioning of a map, in geographical coordinates.
When you have no need to display your map in a whole, you can focus it on a required region. For this purpose, specify the geographical coordinates of this region using the bounds configuration object. There are four fields within this object: minLat and maxLat (which specify latitude) and minLon and maxLon (which specify longitude). See the image below to discover how the values of these fields are applied to the map.
Specifies the geographical coordinates of the center for a map.
By default, the map in the dxVectorMap widget is centered on the (0, 0) point. If you need to center the map on a different geographical point, set its geographical coordinates to the lat and lon field of the center configuration object.
Specifies the options of the control bar.
The control bar is a panel on a map that helps you navigate this map. This panel contains the pan control and the zoom bar for panning and zooming the map correspondingly. You can change the visibility of the control bar and adjust its colors using the options of the controlBar configuration object.
Specifies the appearance of the loading indicator.
In most cases, a vector map is quick enough to draw itself instantly for a viewer. There are cases, however, when the vector map takes longer to be drawn. In these cases, it is recommended that the loading indicator is displayed. Use the vector map's showLoadingIndicator() and hideLoadingIndicator() methods to manage the loading indicator. To specify its appearance, use the loadingIndicator configuration object.
In this example, the map options are assigned 3000 ms after the example is loaded. Until that time, the loading indicator is displayed. Its background and font are changed using the backgroundColor and font options respectively. Make a note that these options should be specified at design-time so that the changes are applied at the right time.
Specifies a data source for the map area.
This option specifies the set of areas represented on a map. To discover different approaches to providing data for map areas, see the Data for Areas topic.
Specifies a data source for the map markers.
To learn how to specify map markers, see the Data for Markers topic.
An object specifying options for the map markers.
A marker is a point on a map accompanied by text that helps you flag places on the map. For example, you can use markers to designate cities on the map. The appearance of the markers is specified by the options of the markerSettings configuration object. If these options are defined on the first level of the markerSettings object, they are applied to all the markers at once. However, you can specify several of these options for certain markers exclusively. See the customize option description to learn how.
In this example, each marker is accompanied by a label that displays the name of the state's capital. This name is obtained from the 'name' attribute of the map's data source using the customize option. The font size of the labels is decreased so that the labels do not overlap each other. In addition, the capability to select/deselect a marker by a click is added using the callback function assigned to the click option. When a marker is selected, it is drawn in a color specified by the selectedColor option.
Notifies a widget that it is embedded into the HTML page that uses a path modifier.
Specifies the size of the dxVectorMap widget.
By default, the widget occupies the entire area of the parent container (division). If the container width or height is set to zero, the widget is not displayed.
If you need to set a size for the widget that differs from the container's size, use the size configuration object. Assign a height and width in pixels to the height and width options of the size object.
Specifies the name of the theme to be applied.
Use this option to specify the name of the theme that should be applied to the widget. For information on customizing and implementing themes, refer to the Themes topic.
Specifies tooltip options.
A tooltip is a small pop-up rectangle that displays information about an area or a marker when it is hovered over. You can enable or disable a tooltip and change its default appearance using the options of the tooltip configuration object.
Specifies a number that is used to zoom a map initially.
Use this option to specify a zoom factor for a map while configuring it. This option accepts a value that is greater than 1. Note that the zooming is performed regarding the center of the map.