Vector Maps

Markers on the world map

Gross domestic product (GDP) by country

USA unemployment

Data for 2009

The following example demonstrates the visualization of unemployment statistics in the USA by states and metropolitan areas in a 5-years time-period. The step-by-step process of creation of such a map is described in the tutorial. The code in Ruby used to convert data could be found in this repository.

Regions selection

The following example demonstrates the feature of jVectorMap that allows selection of regions and/or markers by user or programmatically. Specific styles could be assigned for the selected items. User selection is saved between page reloads in the local storage.

French presidential election, 2007

Nicolas Sarkozy Segolene Royal

French presidential election, 2012

Francois Hollande Nicolas Sarkozy

Generate random colors


The following example demonstrates how to set colors directly for the map. The map is painted to the random colors upon loading. You can click "Update colors" to generate new colors for the map.

Map of the mall

Example of custom map created from SVG using converter available here. Please note that if you use map generated from SVG you need to position markers by pixel coordinates, not by latitude and longitude as in case of map generated from GIS data.

Reverse projection

This example demonstrates the ability to convert pixel coordinates on map to the repsective latitude and longitude coordinates. Click on the map adds marker to the clicked point, click on the added marker removes it.