Interactive Maps Generator (v.1.8.2)

Visual Settings

Background Color
Map Border Color
Map Border Width (px)
Inactive Region Color
Tooltip Text Color
Markers Size
Width (px)
Height (px)
Responsive (Beta)
(Width and Height will be ignored if enabled. Map will load with maximum available size)
Keep Aspect Ratio

Google Geocoding API Key

Some maps will use the Google Geocoding API to convert the region code text into readable data for the API. If your maps are not displaying, get a Geocoding API key and place it here.

Javascript Embed Code

This is the generated code that you can copy and paste in any website you are building.
Current Settings Load Settings
This is a code snippet with the information about the current settings and data entered. You can save this in a text file and re-use it in the future.
Save this content to be able to load your map again in the future and edit it.
Altough the browser might save this in local storage, it might loose it from memory at some point.
 
You can paste into this textarea a previously saved code snippet or any of the ones available in the examples folder.

Map Settings

You don't know where to start? Check out the Documentation or see some Examples.
Region to Display
Display Mode
Interactivity
Active Region Action
Enable
Show Tooltip
Render HTML in Tooltip

Insert Custom Javascript Action Here

You can use Javascript and the array ivalue[selectedRegion] where variable selectedRegion is the code of the region clicked, and ivalue[selectedRegion] corresponds to the value inserted in the "Action Value" field. Example: alert(ivalue[selectedRegion]); // will display a custom alert message.
Use the form below to help you get the coordinates values
Convert Address into Lat/Lon:
Interactive Regions - Simple Mode Advanced Mode
Region Code: Title: Tooltip: Action Value: Color:

Follow the suggestions
above.
MANDATORY

It will be the first line
of the tooltip.

It will be the second line
of the tooltip.

Paramater for the action.
Ex. Url for Open Url Action.
you can leave it blank,
for no action.
Advanced Data Editor
Here you can add or edit the CSV (comma-separated values) data that will be parsed to build the map.
It should follow this format:
Region Code, Tooltip Title, Tooltip Text, Action Value, HTML Color Value;
It should not use quotes. Example:
US, USA, Click to visit the White House Website, http://www.whitehouse.gov/,#6699CC;
PT, Portugal, Click to visit Portugal's Government Website, http://www.portugal.gov.pt/,#660000;

Preview

The 'Active Region Action' will not work on this preview. When an active region is clicked an alert message with the value inserted will display for debugging.
If the preview is not working as expected, make sure you entered data compatible with the Display Regions and Mode selected. If it still doesn't work go to the Interactive Regions advanced tab and make sure no faulty extra line break or space was added in the beggining, end or between the code entries.
Read the Documentation for more information and tips on how to use it.