Geochart app: Explore location-based data at a glance

Use the Geochart app to create maps with circles or regions with different colors. This article explains how to create maps that let you compare values and display categories across geographical regions.

What is the Geochart app?

The Geochart app lets you create basic maps of continents, countries or regions with areas identified either by:

markers: circles used to designate areas; the circles are scaled according to a specified value
regions: countries, provinces or states with specific colors

Geochart: marker mode

In marker mode, the Geochart app displays circles on a map at locations defined by pairs of latitude and longitude values. The circles represent data values with a corresponding size and color: larger circles mean higher values and colors are used for categorization.

Click a particular region to zoom in and see more details. Then click the magnifying glass button in the top-right panel to zoom out.

Copy Template

warning The magnifying glass is not supported in Internet Explorer version 8 (IE8) or earlier. Learn more about why we recommend using modern browsers.

info Geocharts are not scrollable or draggable because they're line drawings (SVG or VML) rather than terrain maps. If you need to use a terrain map, use our Maps app.

Geochart: region mode

In region mode, the Geochart app displays data based on countries or provinces. Depending on the keywords you choose, you can either use:

pure CSS colors for each country or province
colors based on a gradient relative to the values

In this example, the colors are based on a gradient relative to the values. Click a particular region to zoom in and see more details. Then click the magnifying glass button in the top-right panel to zoom out.

Copy Template

Create geocharts with the Geochart app

In the Awesome Table editor:

1. In the sidebar, open the App configuration section.
2. Select Geochart under Visualization type.
3. Select the required mode: Marker, Region or Auto. Learn more: Settings in the Geochart app.
4. Click Update app to apply your changes.

Screenshot_2020-04-03_at_12.07.34.png

Keywords for geocharts with markers

Datasheet:

Screenshot_2020-04-16_at_11.14.54.png

Keywords	Description
Latitude and Longitude	Designate the columns containing latitude and longitude coordinates. info - These keywords are mandatory for geocharts with markers. - Learn more about how to geocode your addresses.
Tooltip	Defines which column displays the tooltip. This can be useful with templates. Data type: Number, string or date
GeochartValue	Makes the color of the markers a gradient relative to the values. Data type: Number info You must use either GeochartValue or GeochartColor. If both are present, GeochartColor overrides GeochartValue.
GeochartColor	Assigns a specific color to the markers. Null values are not allowed. Data type: Number (hex color codes) or String (HTML color names)
GeochartMarkerSize	Assigns the marker size relative to the other marker sizes. Data type: Number If this column is not present, all the circles are of the same size and color. If this column is present and there are null values, a default size is assigned by the Google Maps API for each blank entry.

Keywords for geocharts with regions

Datasheet:

Screenshot_2020-04-16_at_11.16.30.png

Keywords	Description
GeochartLocation	Specify which countries or provinces to color. info This keyword is mandatory for geocharts with regions.
Tooltip	Defines which column displays the tooltip. This can be useful with templates. Data type: Number, string or date
GeochartValue	Makes the color of the markers a gradient relative to the values. info You must use either GeochartValue or GeochartColor. If both are present, GeochartColor overrides GeochartValue.
GeochartColor	Assigns a specific color to the markers. Null values are not allowed. Data type: Number (hex color codes) or String (HTML color names)

Other keywords

You can also use these keywords with the Geochart app.

Keywords	Description
Hidden	Hides a column in your data presentation.
Sidebar	Defines which column displays the tooltip. This can be useful with templates.
HyperlinkType	Adds links to text or image elements and as an alternative to using templates. This is useful if you want to generate links in your table without showing the full links (only text or images are shown). It also hides the URL column.
ButtonType	Displays a button that redirects to a link. You can also specify your link's colour (using HTML Color Names like red, blue, green or hex color codes).
ImageType	Displays images from a column containing links to images. This is an alternative to using templates. When users hover over the image, a larger version pops up.
IconType	Displays icons without using a template. Choose any icons from https://material.io/icons/
RatingType	Transforms numbers from 0 to 5 to star-rating icons.
ListType	Transforms CSV values into HTML ordered lists.
NumberedListType	Transforms CSV values into HTML numbered lists.

Settings in the Geochart app

Setting	Description
Maps display mode	Select Region or Marker. Alternatively, select Auto. Awesome Table tries to find the right mode (region or marker) depending on your data.
Show map legend (optional)	Enable or disable this setting to show or hide your map legend.
Maps height	Enter your preferred map height. Data type: Numeric
Region or country	Makes the map focus on a selected region or a country.
Show provinces (optional)	If one country is selected in the Region or country field, the Show provinces field appears. Select it if you want to display provinces on your geochart.

Screenshot_2020-04-03_at_16.23.27.png

Advanced options in the Geochart app

There are some advanced options you can apply using JSON in the template sheet. To add the options, open your template sheet and add them to a column header.

For example, add the option GeoChartOptions in the header and {"backgroundColor":"gray"} in the first cell to change the background color of your geochart.

Template sheet:

Screenshot_2020-04-15_at_17.50.31.png