This page describes how to create a colored map using the Charts API. This chart is a new, improved version that supports a larger map and more features than the older map chart (cht=t).

Chart-Specific Features

Overview
Supported Parameters
Zooming and Centering

Standard Features

Chart Title (chtt, chts)
Chart Colors (chco)
Chart Margins (chma)
Background Fills
1. Solid Fills (chf)
Chart Legends (chdl, Chdlp)
Shape Markers (chm)
Text and Data Markers (chm)

Overview

You can create a map with various countries or states highlighted in custom colors. You can let the map zoom to the proper level to display your selected countries properly, or you can zoom in or out to a custom level using latitude and longitude values.

Supported Parameters

Map charts support the following parameters:

Parameter	Required or Optional	Description
`cht=map<opt_zoom_and_center>`	Required	Specifies a map chart. opt_zoom_and_center - An optional string that enables you to zoom or center the chart on a specific region. See details.
`chs`	Required	Map size. Maximum dimensions for a map are 600 pixels wide, 600 pixels high, or 300,000 pixels total.
`chd= <first_country_value>, ..., <last_country_value>`	Optional	If used, the data value will indicate the color of the corresponding country, along the color gradient specified by `chco`.
`chld= <country_or_region_codes>\|...\|`	Required	A pipe-separated list of countries or states that will be highlighted in colors specified by `chco`. The map will automatically zoom to include all the countries specified, unless you do custom zooming or centering. Codes must be uppercase. These codes are ISO 3166-1-alpha-2 codes: two uppercase characters, optionally followed by a dash and a second identifier for regions or cities. Examples: GB (Great Britain), GB-LND (London), US-NJ (state of New Jersey in the United States)
`chco` If `chd` is not used: `chco= <unselected_land_color>\| <first_region_color>\| ...\| <last_region_color>` If `chd` is used: `chco= <unselected_land_color>, <color_range_start>, ..., <color_range_end>`	Optional	Chart colors. The format of this string depends on whether you use `chd`. In both syntaxes, `<unselected_land_color>` is the color of any regions not specified in `chld`. Note that the dividers are different for the different syntaxes (commas in one, pipes in the other). If not used, regions will be outlined but not colored. `chd` used - The second and later colors describe a color range. You must have one `chd` value for each country in `chld`, and the corresponding country will be colored along a range from `<first_region_color>` (minimum data range value) to `<last_region_color>` (maximum data range value). See examples in the table below. `chd` not used - The second and later colors are applied to the corresponding regions in `chld`, in the order listed. If there are more countries than colors, the last color will be applied to all excess countries in the list.
`chtt, chts`	Optional	Chart title and style
`chm`	Optional	Chart markers
`chma`	Optional	Chart margins
`chf=bg...`	Optional	Solid fills (background only)
`chdl`	Optional	Chart legends

Examples

Description Example

In this example:

cht=map:fixed=-60,0,80,-35 - The chart zoom area is -60 latitude to 80 latitude, 0 longitude to -35 longitude
chld=CA-BC|CN|IT|GR|US-UT - Regions highighted are British Columbia, China, Italy, Greeze, and Utah.
chm - Chart markers for the flags.
chma=0,110,0,0 - The right side border increased to 110 pixels, to fit the legend properly.
chtt=Last+Five+Olympic+Hosts - Chart title, with + used to indicate spaces.

Map of five olympic host countries, showing flag markers.
cht=map:fixed=-60,0,80,-35 chs=600x350 chld=CA-BC|CN|IT|GR|US-UT chdl=Vancouver|Beijing|Torino|Athens|Salt+Lake+City chco=B3BCC0|5781AE|FF0000|FFC726|885E80|518274 chtt=Last+Five+Olympic+Hosts chm=f2010+Winter,000000,0,0,10 f2008+Summer,000000,0,1,10 f2008+Winter,000000,0,2,10,1,:-5:10 f2004+Summer,000000,0,3,10 f2004+Summer,000000,0,4,10 chma=0,110,0,0

A map showing France, with two regions highlighted:

chld=FR-D|FR-B|FR - Three regions are specified: Bourgogne (in the east), Aquitaine (in the southwest), and France.
chco=676767|FF4444|44FF44|4444FF - No chd parameter is specified in this map, so each color value after the first is used to specify the corresponding country. Red for Bourgogne, green for Aquitaine, blue for France. You can see that later colors do not mask earlier colors.

Map of France, highlighting two provinces.

chld=FR-D|FR-B|FR

            chco=676767|FF4444|44FF44|4444FF

This map demonstrates using color gradients.

chd=t:0,50,100 - The chd parameter indicates a color gradient. Here, text encoding is specified, which has a range from 0—100.
chco=CCCCCC,FF0000,000000 - Background color is light gray (CCCCCC), and the color range is from red (FF0000) to black (000000). The middle country shown is an intermediate color on that gradient.

chd=t:0,50,100

chco=CCCCCC,FF0000,000000

Note that the map can be cropped inside the specified chart size. This is because we will not distort a map to fit inside a specified chart size, but we limit the map to the regions that you specify in chld. Therefore, to avoid cropped regions inside the chart boundaries, you might have to adjust the map size manually.

cht=map chs=300x300 chld=GB

England is naturally long and thin, so specifying a square map includes a cropped area on the right side:

cht=map chs=180x300 chld=GB

Adjust the chart width to crop off the excess. Note how there's still some cropping on the bottom that should be fixed by reducing the map height.

cht=map chs=180x300 chld=GB

France is much more regularly shaped, so it fits more naturally in a square map.

Zooming and Centering

By default, the chart will be zoomed and centered to center your selected regions, and make them fit into the rendered area as closely as possible, within the defined map size. However, you can customize the centering and zooming level of the chart in two different ways:

By pixel

To adjust the borders by pixel size, use this format:

cht=map:auto=<left_border>,<right_border>,<top_border>,<bottom_border>

Where each border size is the additional border to show, in pixels, beyond the automatically calculated zoom level.

You can only zoom out (positive values); you cannot zoom in (negative values) closer than the default zoom level using pixel zooming.

Examples:

These examples all show London (Lat

No Zooming (default)	Zoomed out 30 pixels per side	Zoomed out and down to the right
`cht=map`	`cht=map:auto=30,30,30,30`	`cht=map:auto=50,0,80,0`

By Latitude and Longitude

You can specify the exact top, bottom, left, and right borders of the rendered map by latitude and longitude using the syntax shown here:

cht=map:fixed=<bottom_border_lat>,<left_border_long>,<top_border_lat>,<right_border_long>

Where <bottom_border_lat> and <top_border_lat> specify the latitude of the bottom and top borders, and <left_border_long> and <right_border_long> specify the longitude of the left and right borders.

Note: Because of Mercator projection distortion (basically, projecting a curved map onto a flat image), focusing on a tall, narrow strip can cause some unexpected size differences in your map.

Examples:

The following examples show London (highlighted in blue) which is 0.1° longitude, 51.5° latitude. Note how there is map cropping because the map is trying to display only Great Britain (as specified) and fill the designated chart without distortion.

Centered	Latitudes shifted +10*	Zoomed by reducing all values
`cht=map:fixed=40,-10,60,10`	`cht=map:fixed=50,-10,70,10`	`cht=map:fixed=48,-3,54,3`

Note how the size of the middle image is a bit smaller than the first image, even though we've moved the same number of degrees up. This is because we're projecting a 3-D sphere onto a 2-D image. You would have to increase the width of the second chart to make it the same size as the first chart.

Standard Features

The rest of the features on this page are standard chart features.

Chart Feature List

Image Charts (Deprecated)

Map Charts

Table of Contents