Attributes

On the figure

Attribute	Does
data-chart	Makes the figure a chart: column, bar, line, area, waterfall or donut, or scatter from the additional types
data-chart-src	Reads the data from a JSON file. See Data.
data-chart-stack	Puts the values of a row on top of each other, in a column, bar, line or area chart
data-chart-shape="step"	Makes each value flat across its row, in a line or area chart
data-chart-shape="smooth"	Makes a line or area chart a curve through every point. data-chart-shape="straight" makes it straight when the shape option is "smooth".
data-chart-animate="grow"	How the chart builds: grow, each element from zero, or sweep, in one movement. false shows the chart from the start, without animation. See Animation.
data-fragment	On the figure, every row is a step; on a row, a column header or an annotation, that one is. See Step by step.
data-fragment-index	Rows with the same index arrive on the same step
data-chart-entrance="0.25"	How far an element around the chart that animates in is in before the chart builds, from 0 to 1. See Animated parents.
data-chart-legend	Puts the names of the lines in a legend. data-chart-legend="false" turns it off.
data-chart-labels	Puts the numbers of a column chart inside or outside the columns
data-chart-aspect	Sets the height of the chart as a share of its width, such as 0.5
data-chart-tooltip="auto"	The tooltip of the chart: auto only when the chart does not show all its numbers, false never, true always.
data-chart-table="auto"	When the table is shown under the chart: always, print, auto (in print, when the chart does not show all its numbers) or never
data-chart-axis	Adds numbers along the value axis of a column, bar, line, area or waterfall chart. data-chart-axis="false" turns them off when the axis option is true.
data-chart-grid	Adds a light line at each number of the value axis, or of both axes on a scatter chart. data-chart-grid="false" turns it off when the grid option is true.
data-chart-scale="0 100"	Where the value axis starts and ends, or with three numbers or more, the numbers along it. On a scatter chart it is the axis up, and data-chart-scale-y is another name for it. See The scale.
data-chart-scale-x="0 100"	The same, for the axis across
data-chart-names="false"	Turns off the names next to the markers of a scatter chart
data-chart-keys	Adds translation keys to the names, starting with its value. See Translation.

On a row

Attribute	Does
data-kind="total"	Makes the row a total, in a waterfall or a donut
class	Is copied to the bar, the number and the name of the row

On a column header

Attribute	Does
data-kind="focus"	Highlights the line or the bars of this column. The others are shown fainter.
data-marker	Sets the point of the line: circle, square or diamond, with open for an open point
data-line	Makes the line dashed or dotted
data-group	On a scatter chart: the cells of this column name the groups. Each group has its own colour and shape. See Scatter.

On an annotation

Each annotation is a span with data-annotation, in a div with the class chart-annotations. See Annotations.

Annotation	Attribute	Sets
bracket	data-from, data-to	The rows the bracket runs between. The first row is 1.
trend	data-at	Where the badge is along the arrow, from 0 to 1
trend	data-years	The number of years, to check the yearly rate you wrote
axis-break	data-from, data-to	The part of the scale that is made smaller
axis-break	data-size	The share of the height that part gets, as a percentage
axis-break	data-mark	How the break is shown: two slanted lines by default, or zigzag. See Scale break.
reference	data-value	A line at a value on the value axis: a number, mean or median of the values
reference	data-name	A line among names that are numbers: a number, mean or median, with each name counted as often as its value
reference	data-axis="y"	On a scatter chart, puts the line across, at a value on the axis up
reference	data-line	dotted makes the line dotted. It is dashed by default.
All	data-series	The line the annotation uses, on a chart with several lines. The first line is 1.

Set by Tablechart

Tablechart adds these attributes. You can use them in CSS.

Attribute	On	Says
data-row	Bars, numbers	The row, counted from 1
data-series	Lines, points, bars, numbers, names	The value column, counted from 1
data-slice	Donut slices	The slice, counted from 1
data-marker, data-open	Points	The shape of the point, and if it is open
data-left-out	Numbers	The number is left out for lack of room

Next

For the options of init(), see Options.