React VectorMap Events

This section describes events fired by this widget.

See Also

areaClick Deprecated

Use the onClick event instead.

Fires when a user clicks an area.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

jQueryEvent

jQuery.Event

Use 'event' instead.

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event

Event (jQuery or EventObject)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

target

Area

The Area object.

Cannot be used in themes.

When implementing a handling function, use the object passed to it as its parameter. Among the fields of this object, you can find the clicked area. An object that represents this area has fields and methods documented in the Area class description.

See Also

areaSelectionChanged Deprecated

Use the onSelectionChanged event instead.

Fires when a user selects/deselects an area.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

target

Area

The selected/deselected area; described in the Area section.

Cannot be used in themes.

When implementing a handling function, use the object passed to it as the parameter. Among the fields of this object, you can find the selected/deselected area. An object that represents this area has fields and methods documented in the Area class description.

To identify whether an area has been selected or deselected, call its selected() method. Pass true or false to this method to select or deselect the area.

See Also

centerChanged

Fires when the coordinates of the map center are changed.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

center

Array<Number>

The updated geographical coordinates of the center.

Cannot be used in themes.

If you need to perform specific actions when the coordinates of the map center are changed, implement a function that handles the centerChanged event. This function will be called every time a user moves the map or when the center is being changed in code by calling the center(centerCoordinates) or viewport(viewportCoordinates) method. When implementing this function, use the object passed to it as its parameter. Among the fields of this object, you can find the updated center coordinates.

See Also

click

Fires when a user clicks on any place on the map.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

jQueryEvent

jQuery.Event

Use 'event' instead.

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event

Event (jQuery or EventObject)

The event that caused the handler execution extended by the x and y fields. It is a dxEvent or a jQuery.Event when you use jQuery.

target

Layer Element

The Layer Element object (if available).

Cannot be used in themes.

When implementing a handling function, use the object passed to it as its parameter. Among the fields of this object, you can find the object that represents the jQuery event extended by the following fields.

  • x
    Contains the X coordinate of the clicked point.
  • y
    Contains the Y coordinate of the clicked point.
NOTE
The coordinates are calculated relatively to the client area, i.e., the widget container. To convert them into map coordinates, use the convertCoordinates(x,y) method.
See Also

disposing

Raised when the widget is removed from the DOM using the remove(), empty(), or html() jQuery methods only.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

See Also

drawn

Raised when the widget's rendering has finished.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

Cannot be used in themes.

See Also

exported

Raised after data from the widget is exported.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

See Also

exporting

Raised before data from the widget is exported.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

fileName

String

The name of the file to which the widget is about to be exported.

cancel

Boolean

Allows you to prevent exporting.

format

String

The resulting file format. One of PNG, PDF, JPEG, SVG and GIF.

See Also

fileSaving

Raised before a file with exported data is saved on the user's local storage.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

fileName

String

The name of the file to be saved.

format

String

The format of the file to be saved.
Possible Values: 'PNG' | 'PDF' | 'JPEG' | 'SVG' | 'GIF'

data

BLOB

Exported data as a BLOB.

cancel

Boolean

Allows you to prevent file saving.

See Also

incidentOccurred

Raised when an error or warning appears in the widget.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

target any

Information on the occurred incident.

Main article: onIncidentOccurred

See Also

initialized

Raised only once, after the widget is initialized.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

Main article: onInitialized

See Also

markerClick Deprecated

Use the onClick event instead.

Fires when a user clicks a marker.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

jQueryEvent

jQuery.Event

Use 'event' instead.

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event

Event (jQuery or EventObject)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

target

Marker

The Marker object.

Cannot be used in themes.

When implementing a handling function, use the object passed to it as its parameter. Among the fields of this object, you can find the clicked marker. An object that represents this marker has fields and methods documented in the Marker class description.

See Also

markerSelectionChanged Deprecated

Use the onSelectionChanged event instead.

Fires when a user selects/deselects a marker.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

target

Marker

The selected/deselected marker; described in the Marker section.

Cannot be used in themes.

When implementing a handling function, use the object passed to it as its parameter. Among the fields of this object, you can find the selected/deselected marker. An object that represents this marker has fields and methods documented in the Marker class description.

To identify whether a marker has been selected or deselected, call its selected() method. Pass true or false to this method to select or deselect the marker.

See Also

optionChanged

Raised after a widget option is changed.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
name

String

The option's short name.

model

Object

The model data. Available only if you use Knockout.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

component

Object

The widget's instance.

fullName

String

The option's full name.

value any

The option's new value.

See Also

selectionChanged

Fires when a user selects/deselects a layer element.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

target

Layer Element

The selected/deselected layer element; described in the Layer Element section.

Cannot be used in themes.

When implementing a handling function, use the object passed to it as its parameter. Among the fields of this object, you can find the selected/deselected layer element. An object that represents this element has fields and methods documented in the Layer Element class description.

To identify whether a layer element has been selected or deselected, call its selected() method. Pass true or false to this method to select or deselect the marker.

tooltipHidden

Fires when a tooltip of an area or marker becomes hidden.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

target

Layer Element

The layer element whose tooltip is hidden; described in the Layer Element section.

Cannot be used in themes.

The tooltip becomes invisible when a user hovers the mouse cursor over another marker/area or moves it outside the widget.

When a tooltip is made hidden, you can perform specific actions by handling this event. To do this, implement a handling function and assign it to the onTooltipHidden option. When implementing this function, use the object passed to it as its parameter. Among the fields of this object, you can find the area or marker whose tooltip becomes hidden.

See Also

tooltipShown

Fires when a tooltip of an area or marker appears.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

target

Layer Element

The layer element whose tooltip is shown; described in the Layer Element section.

Cannot be used in themes.

The tooltip appears when a user hovers the mouse cursor over a marker or area.

When a tooltip appears, you can perform specific actions by handling this event. To do this, implement a handling function and assign it to the onTooltipShown option. When implementing this function, use the object passed to it as its parameter. Among the fields of this object, you can find the area or marker whose tooltip appears.

See Also

zoomFactorChanged

Fires when the map zoom factor is changed.

Type:

Event

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

Object

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

The model data. Available only if you use Knockout.

zoomFactor

Number

The updated zoom factor.

Cannot be used in themes.

If you need to perform specific actions when the map zoom factor is changed, implement a function that handles the zoomFactorChanged event. This function will be called every time a user zooms the map or when the zoom factor is changed in code by calling the zoomFactor(zoomFactor) or viewport(viewportCoordinates) method. When implementing this function, use the object passed to it as its parameter. Among the fields of this object, you can find the updated zoom factor.

See Also