World vector map

Example of a world map in SVG format with zoom feature. The map automatically scales on small window sizes. Vector maps work in all modern browsers, including Internet Explorer since it uses native browser technologies like JavaScript, CSS, HTML, SVG or VML. No Flash or any other proprietary browser plug-in is required. Also this allows vector maps to work in all modern mobile browsers.

Choropleth map

Example of a choropleth world map. A choropleth map is a thematic map in which areas are shaded or patterned in proportion to the measurement of the statistical variable being displayed on the map. The choropleth map provides an easy way to visualize how a measurement varies across a geographic area or it shows the level of variability within a region. This example displays GDP by country, data stored in json file.

Custom markers

Simple example of a basic world map with optional 1 size markers. Set of markers are added to the map during initialization. In case of array is provided, codes of markers will be set as string representations of array indexes. Each marker is represented by latLng (array of two numeric values), name (string which will be show on marker's label) and any marker styles. Marker size, colors, strokes, opacity can be changed in map settings.

Regions selection

Example map of Germany with selectable regions and markers. The following example demonstrates the feature of vector maps 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 by using onRegionSelected and onMarkerSelected functions. The circle size depends on the data values.

Country choropleth map

Example of USA choropleth map with markers. The following example demonstrates the visualization of unemployment statistics in the USA by states and metropolitan areas in 2009. Demo data is stored in JSON file. Tooltips with 2 different types of data: regions display state name and unemployment rate, custom markers display full info available in JSON file: population, name and unemployment rate.