Dashdown Docs

Charts

Every chart type shares one rendering path (ECharts, drawn client-side from the query result), so they share most attributes. Pick a type below for a live example; the common attributes are here.

Shared attributes #

Attribute Purpose
data Required. The query to plot (data={query}).
x Column for the category / x-axis.
y Column for the value / y-axis — or several, comma-separated, for multiple metrics.
series A second dimension — split one value column into a series per group.
title Chart title.
sort_by Column to sort the data by before plotting.
color A single color or comma-separated palette override.
height Pixel height (default 300).
col-span Columns to span inside a <Grid>.
format, currency, decimals, locale, date_format Value-axis & tooltip number/date formatting — see Formatting.
empty_message Message shown (centered) when the query returns no rows, for every chart type. Default "No data available".

A few types take their own attributes on top of the shared set — distribution charts (BoxPlot, Violin), MapChart, HeatmapChart (a value column), SankeyChart / GraphChart (source/target/value), CandlestickChart (open/high/low/close), GaugeChart (min/max), SunburstChart / TreeChart (id/parent/value/label), and ParallelChart (dimensions) — see their pages.

LineChart and BarChart also take stacked — with a series column it stacks the groups on a shared total (a stacked area / stacked bar).

Multiple series #

There are two ways to draw more than one coloured series — pick by the shape of your data:

You have… Use Result
one value column + a category to split by series="region" (a second dimension) one series per category value
several value columns side by side y="revenue,profit" (comma-separated) one series per metric 
<!-- second dimension: one metric, split by a category -->
<BarChart data={by_channel} x="month" y="downloads" series="channel" />

<!-- multiple metrics: several value columns at once -->
<BarChart data={downloads_by_channel_wide} x="month" y="pip,docker,source" />

Add stacked to stack the groups on a shared total:

Both give a legend and a colour per series; they're mutually exclusive (if you set both, series wins). On a PieChart, series= instead renders faceted small multiples — one pie per value, sharing a slice legend. The same series= / multi-metric grammar works on semantic-layer charts (series={model.dim} / metric="model.a,model.b").

The chart types #

Type Best for
LineChart Trends over time
BarChart Comparing categories
ComboChart Bars + lines together, with a second y-axis
PieChart Part-to-whole
ScatterChart Correlation between two numbers
FunnelChart Stage-by-stage drop-off
TreemapChart Nested proportions
CalendarHeatmap Daily values over a year
BoxPlot / Violin Distributions
MapChart Values by geography
RadarChart Comparing many metrics at once
GaugeChart A single KPI against a target
HeatmapChart Intensity across a category grid
SankeyChart Flows between stages
CandlestickChart OHLC price / range data
ThemeRiver Category streams over time
GraphChart Relationships in a network
SunburstChart Hierarchy as proportional rings
TreeChart Hierarchy as a node-link diagram
ParallelChart Many numeric dimensions at once
Chart auto Let Dashdown infer the type
Generated