Image Map

Description

Example demonstrates an interactive world map.

Discussion

In this example, the ViewBox has been configured to display a world map using SVG. When a country is selected, the 'value' of the ViewBox is set to the selected country, which is displayed at the top of the screen. The selected country is also given a different fill color to emphasis that it has been selected. When another country is selected, the previously selected is automatically deselected.

images/imageMap1.png

You can use the {dialog.object}.setValue method to programmatically select a country. For example, the code below would select the country of 'Brazil':

{dialog.object}.setValue('MY_VIEWBOX','Brazil');

The Image Map example is loaded by clicking the Load Sample ViewBox link on the Home tab of the ViewBox Builder.

images/loadImageMap.png