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.

Scatter plots place each data record as a point on a two-dimensional grid, with the horizontal position set by x, the vertical position set by y, and optional visual encodings for color and size. They are best suited for exploring correlations and outliers across a continuous or ordinal dataset. 
var chart = new Taucharts.Chart({
    type  : 'scatterplot',
    x     : 'Cycle Time',
    y     : 'SUM(Bugs Count)',
    color : 'Team',
    size  : 'Sum(User Stories Count)',
    data  : [
        { 'Cycle Time': 186, 'SUM(Bugs Count)': 34, 'Team': 'HDP', 'Sum(User Stories Count)': 10 },
        { 'Cycle Time': 230, 'SUM(Bugs Count)': 12, 'Team': 'Alpha', 'Sum(User Stories Count)': 4 },
        { 'Cycle Time': 90,  'SUM(Bugs Count)': 55, 'Team': 'HDP', 'Sum(User Stories Count)': 20 }
    ],
    plugins: [
        Taucharts.api.plugins.get('legend')(),
        Taucharts.api.plugins.get('tooltip')()
    ]
});

chart.renderTo('#chart');

​
Configuration

​
type
string
required
Must be "scatterplot".
​
x
string
required
The data field mapped to the horizontal axis.
​
y
string
required
The data field mapped to the vertical axis.
​
color
string
A data field used to color-encode points. Each unique value in the field receives a distinct color from the brewer palette.
​
size
string
A data field used to scale point area. Taucharts maps the field’s numeric range to a minimum and maximum bubble size. Omit this field to render all points at the same size.
​
label
string
A data field whose value is rendered as a text label on each point.
​
data
object[]
required
Array of plain objects. Each object represents one data point and must contain all fields referenced by x, y, color, size, and label.
​
guide
object
Visual configuration for axes, padding, and grid lines. See ChartGuide for the full schema.
​
plugins
object[]
Array of plugin instances. Common choices for scatter plots are legend and tooltip.

​
Example with real data

var chart = new Taucharts.Chart({
    type : 'scatterplot',
    x    : 'horsepower',
    y    : 'mpg',
    color: 'origin',
    size : 'weight',
    data : [
        { horsepower: 130, mpg: 18, origin: 'USA',    weight: 3504 },
        { horsepower: 165, mpg: 15, origin: 'USA',    weight: 3693 },
        { horsepower:  75, mpg: 24, origin: 'Europe', weight: 2246 },
        { horsepower:  92, mpg: 27, origin: 'Japan',  weight: 2126 }
    ],
    guide: {
        x: { label: 'Horsepower' },
        y: { label: 'Miles per gallon' }
    },
    plugins: [
        Taucharts.api.plugins.get('tooltip')()
    ]
});

chart.renderTo('#chart');
The size field must contain numeric values. Taucharts scales the point radius proportionally to the field’s value range across the dataset.
Add the tooltip plugin to let users inspect individual point values on hover. Pair it with the legend plugin when using color to label each group.

Build docs developers (and LLMs) love

Get started for freeTalk to us