Datasets Style

datasets

datasets 設定上，主要是label 、線色、線寬、fill等設定。

Dataset Configuration

Name	Type	Description
label	string	The label for the dataset which appears in the legend and tooltips.
clip	number|object	How to clip relative to chartArea. Positive value allows overflow, negative value clips that many pixels inside chartArea. 0 = clip at chartArea. Clipping can also be configured per side: clip: {left: 5, top: false, right: -2, bottom: 0}
order	number	The drawing order of dataset. Also affects order for stacking, tooltip and legend.
stack	string	The ID of the group to which this dataset belongs to (when stacked, each group will be a separate stack). Defaults to dataset type.
parsing	boolean|object	How to parse the dataset. The parsing can be disabled by specifying parsing: false at chart options or dataset. If parsing is disabled, data must be sorted and in the formats the associated chart type and scales use internally.
hidden	boolean	Configure the visibility of the dataset. Using hidden: true will hide the dataset from being rendered in the Chart.

Elements

Point Configuration

Point elements are used to represent the points in a line, radar or bubble chart.

Namespace: options.elements.point, global point options: Chart.defaults.elements.point.

Name	Type	Default	Description
radius	number	3	Point radius.
pointStyle	string|Image	'circle'	Point style.
rotation	number	0	Point rotation (in degrees).
backgroundColor	Color	Chart.defaults.backgroundColor	Point fill color.
borderWidth	number	1	Point stroke width.
borderColor	Color	'Chart.defaults.borderColor	Point stroke color.
hitRadius	number	1	Extra radius added to point radius for hit detection.
hoverRadius	number	4	Point radius when hovered.
hoverBorderWidth	number	1	Stroke width when hovered.

#Point Styles

The following values are supported:

• 'circle'

• 'cross'

• 'crossRot'

• 'dash'

• 'line'

• 'rect'

• 'rectRounded'

• 'rectRot'

• 'star'

• 'triangle'

If the value is an image, that image is drawn on the canvas using drawImage .

#Line Configuration

Line elements are used to represent the line in a line chart.

Namespace: options.elements.line, global line options: Chart.defaults.elements.line.

Name	Type	Default	Description
tension	number	0	Bézier curve tension (0 for no Bézier curves).
backgroundColor	Color	Chart.defaults.backgroundColor	Line fill color.
borderWidth	number	3	Line stroke width.
borderColor	Color	Chart.defaults.borderColor	Line stroke color.
borderCapStyle	string	'butt'	Line cap style. See MDN.
borderDash	number[]	[]	Line dash. See MDN.
borderDashOffset	number	0.0	Line dash offset. See MDN.
borderJoinStyle	string	'miter'	Line join style. See MDN.
capBezierPoints	boolean	true	true to keep Bézier control inside the chart, false for no restriction.
cubicInterpolationMode	string	'default'	Interpolation mode to apply. See more...
fill	boolean|string	false	How to fill the area under the line. See area charts.
stepped	boolean	false	true to show the line as a stepped line (tension will be ignored).

#Bar Configuration

Bar elements are used to represent the bars in a bar chart.

Namespace: options.elements.bar, global bar options: Chart.defaults.elements.bar.

Name	Type	Default	Description
backgroundColor	Color	Chart.defaults.backgroundColor	Bar fill color.
borderWidth	number	0	Bar stroke width.
borderColor	Color	Chart.defaults.borderColor	Bar stroke color.
borderSkipped	string	'start'	Skipped (excluded) border: 'start', 'end', 'bottom', 'left', 'top' or 'right'.
borderRadius	number|object	0	The bar border radius (in pixels).
pointStyle	string|Image	'circle'	Style of the point for legend.

#Arc Configuration

Arcs are used in the polar area, doughnut and pie charts.

Namespace: options.elements.arc, global arc options: Chart.defaults.elements.arc.

Name	Type	Default	Description
angle - for polar only	number	circumference / (arc count)	Arc angle to cover.
backgroundColor	Color	Chart.defaults.backgroundColor	Arc fill color.
borderAlign	string	'center'	Arc stroke alignment.
borderColor	Color	'#fff'	Arc stroke color.
borderWidth	number	2