Map geo chart component

What is the map geo chart?

The Map geo chart renders region maps, comparing countries/regions by chosen parameters.

Why use the map geo chart?

Add interaction to your app using the map geo chart component

Get Started

Pre-requisite – This component requires a Google API Key, click here to learn more. To use the map component you will need to:

1. Set up a Google API key 
2. Configure the map 
3. Configure the map settings 
4. Select the map color scheme 
5. Test the map

Step 1 – Set up a Google API Key

1. Add the map geo chart screen to your app using the “Add screens” button
2. Click the map geo chart box to open settings on the right-hand side
3. You must first have an account set up with Google to access their API functionality. For more on setting up a Google API key see here
4. Once you have set up and configured your Google API Key, copy the key and past it into the text field

Step 2 – Configure the map

Once your API has been inserted into the text box you will next configure your map 

1. Choose your map type 
   1. World 
   2. Continents 
   3. Countries 
   4. States in the US 
2. Depending on the selected option above, you will then have a list of choices to choose from (this field is required) 
   1. Continents- list of world continents 
   2. Countries – list of world countries
   3. States in the US- list of US states 
3. Depending on the selected option above, you will have the option to choose how the map is displayed, either the whole map or broken down into subcategories 
   1. Country: Show regions – Supported only for country regions and US state regions. Not supported for all countries; please test a country to see whether this option is supported
   2. States of the US: Show metros – Supported for the US country region and US state regions only
   3. You will select yes if you wish to display the above info, if not leave the box unticked
      

Step 3 – Configure the map Settings 

1. Under “Map data”, select data source that the relevant map data is stored in 
2. Region location – select a region to highlight
3. Region data – select the column name or type of data you would like to show on your map 
4. List from Data Source Screen 
   1. Choose a result screen (with an LFD component that uses the same data source) to go to when a map region is clicked
   2. Select the screen that users should be taken to when they click on a specific location on your map. The LFD will open with the location information that is stored in the connected data source 

Step 4- Select the map color scheme

1. Set a range of colors from a low, medium, or high depending on the information that is stored in the related data source.
2. If no numerical values are set, any colors can be used to style the map
3. Using the color picker, select the color of choice for each level
4. Save & close

Step 5- Test the map

Once you have configured your map, we recommend testing

1. To test your map, go to Preview mode
2. Make sure you can see your map as it was configured in edit mode