Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/TargetProcess/tauCharts/llms.txt

Use this file to discover all available pages before exploring further.

Map charts render data against a geographic background loaded from a TopoJSON source. You can use them in two modes: choropleth mode, where regions are colored according to a data value using fill and code, and point mode, where individual records are placed at specific coordinates using latitude and longitude.
var chart = new Taucharts.Chart({
    type : 'map',
    code : 'country',
    fill : 'gdp',
    color: 'region',
    data : [
        { country: 'DEU', gdp: 3.8,  region: 'Europe' },
        { country: 'FRA', gdp: 2.7,  region: 'Europe' },
        { country: 'JPN', gdp: 4.9,  region: 'Asia'   },
        { country: 'BRA', gdp: 1.8,  region: 'Americas' }
    ]
});

chart.renderTo('#chart');

Validation rules

Two rules are enforced when building a map spec:
  1. fill requires code — If you specify fill, you must also specify code. The code field identifies which geographic region each data record maps to.
  2. latitude and longitude must both be present — If you specify one coordinate field, you must specify the other. Providing only one raises an error.

Configuration

type
string
required
Must be "map".
code
string
A data field containing ISO 3166-1 alpha-3 country codes (e.g. "DEU", "FRA"). Required when using fill. The default georole is "countries".
fill
string
A data field whose numeric values are mapped to a sequential fill color scale across geographic regions. Must be used together with code.
latitude
string
A data field containing the latitude coordinate for point placement. Must be specified together with longitude.
longitude
string
A data field containing the longitude coordinate for point placement. Must be specified together with latitude.
color
string
A data field used to color-encode points (point mode) or to apply a categorical color override on regions (choropleth mode).
size
string
A data field used to scale point size in point placement mode. The size range defaults to { min: 1, max: 10 }.
data
object[]
required
Array of plain objects containing the geographic identifier or coordinate fields, along with any measure fields.
guide
object
Map-specific visual configuration. Supports a sourcemap string to override the TopoJSON URL, and code.georole to change the geographic feature type.
plugins
object[]
Array of plugin instances.

Point placement example

var chart = new Taucharts.Chart({
    type     : 'map',
    latitude : 'lat',
    longitude: 'lng',
    size     : 'magnitude',
    color    : 'type',
    data     : [
        { lat: 35.6,  lng: 139.7, magnitude: 6.2, type: 'tectonic' },
        { lat: 37.8,  lng: -122.4, magnitude: 4.5, type: 'tectonic' },
        { lat: -33.9, lng: 151.2, magnitude: 3.1, type: 'induced'  }
    ]
});

chart.renderTo('#chart');
The default source map is loaded from the Taucharts GitHub repository as a world countries TopoJSON file. Override guide.sourcemap with a URL to your own TopoJSON file to display a custom geography.
Specifying fill without code will throw a validation error: [code] must be specified when using [fill]. Similarly, providing only latitude or only longitude will throw: [latitude] and [longitude] both must be specified.

Build docs developers (and LLMs) love