# 元素

¥Elements

虽然图表类型提供了用于配置每个数据集样式的设置，但有时你希望以相同的方式设置所有数据集的样式。一个常见的示例是用相同的颜色对柱状图中的所有条形进行描边，但更改每个数据集的填充。可以为四种不同类型的元素配置选项：arc、lines、points 和 bars。设置后，这些选项适用于该类型的所有对象，除非被附加到数据集的配置特别覆盖。

¥While chart types provide settings to configure the styling of each dataset, you sometimes want to style all datasets the same way. A common example would be to stroke all the bars in a bar chart with the same colour but change the fill per dataset. Options can be configured for four different types of elements: arc, lines, points, and bars. When set, these options apply to all objects of that type unless specifically overridden by the configuration attached to a dataset.

# 全局配置

¥Global Configuration

可以按图表或全局指定元素选项。元素的全局选项在 Chart.defaults.elements 中定义。例如，要全局设置所有柱状图的边框宽度，你可以执行以下操作：

¥The element options can be specified per chart or globally. The global options for elements are defined in Chart.defaults.elements. For example, to set the border width of all bar charts globally, you would do:

Chart.defaults.elements.bar.borderWidth = 2;

# 点配置

¥Point Configuration

点元素用于表示折线图、雷达图或气泡图中的点。

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

命名空间：options.elements.point、全局点选项：Chart.defaults.elements.point。

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

名称	类型	默认	描述
`radius`	`number`	`3`	点半径。
`pointStyle`	`pointStyle`	`'circle'`	点样式。
`rotation`	`number`	`0`	点旋转（以度为单位）。
`backgroundColor`	`Color`	`Chart.defaults.backgroundColor`	点填充颜色。
`borderWidth`	`number`	`1`	点笔划宽度。
`borderColor`	`Color`	`'Chart.defaults.borderColor`	点描边颜色。
`hitRadius`	`number`	`1`	添加到点半径的额外半径以进行命中检测。
`hoverRadius`	`number`	`4`	悬停时的点半径。
`hoverBorderWidth`	`number`	`1`	悬停时的笔划宽度。

# 点样式

¥Point Styles

# 类型

¥Types

pointStyle 参数接受以下类型的输入：string、Image 和 HTMLCanvasElement

¥The pointStyle argument accepts the following type of inputs: string, Image and HTMLCanvasElement

# 信息

¥Info

当提供字符串时，支持以下值：

¥When a string is provided, the following values are supported:

'circle'
'cross'
'crossRot'
'dash'
'line'
'rect'
'rectRounded'
'rectRot'
'star'
'triangle'
false

如果值为图片或画布元素，则使用 drawImage (opens new window) 在画布上绘制该图片或画布元素。

¥If the value is an image or a canvas element, that image or canvas element is drawn on the canvas using drawImage (opens new window).

# 折线配置

¥Line Configuration

折线元素用于表示折线图中的折线。

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

命名空间：options.elements.line、全局线路选项：Chart.defaults.elements.line。

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

名称	类型	默认	描述
`tension`	`number`	`0`	贝塞尔曲线张力（`0` 表示没有贝塞尔曲线）。
`backgroundColor`	`Color`	`Chart.defaults.backgroundColor`	线条填充颜色。
`borderWidth`	`number`	`3`	线条笔划宽度。
`borderColor`	`Color`	`Chart.defaults.borderColor`	线条描边颜色。
`borderCapStyle`	`string`	`'butt'`	线帽样式。见 MDN (opens new window)。
`borderDash`	`number[]`	`[]`	划线。见 MDN (opens new window)。
`borderDashOffset`	`number`	`0.0`	虚线偏移量。见 MDN (opens new window)。
`borderJoinStyle`	`'round'`\|`'bevel'`\|`'miter'`	`'miter'`	线连接样式。见 MDN (opens new window)。
`capBezierPoints`	`boolean`	`true`	`true` 保持图表内的 Bézier 控制，`false` 无限制。
`cubicInterpolationMode`	`string`	`'default'`	要应用的插值模式。查看更多...
`fill`	`boolean`\|`string`	`false`	如何填充线下的区域。见面积图。
`stepped`	`boolean`	`false`	`true` 将线条显示为阶梯线（`tension` 将被忽略）。

# 柱状配置

¥Bar Configuration

条形元素用于表示柱状图中的条形。

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

命名空间：options.elements.bar、全局栏选项：Chart.defaults.elements.bar。

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

名称	类型	默认	描述
`backgroundColor`	`Color`	`Chart.defaults.backgroundColor`	条形填充颜色。
`borderWidth`	`number`	`0`	条形笔划宽度。
`borderColor`	`Color`	`Chart.defaults.borderColor`	条形描边颜色。
`borderSkipped`	`string`	`'start'`	跳过（排除）边界：`'start'`、`'end'`、`'middle'`、`'bottom'`、`'left'`、`'top'`、`'right'` 或 `false`。
`borderRadius`	`number`\|`object`	`0`	条形边框半径（以像素为单位）。
`inflateAmount`	`number`\|`'auto'`	`'auto'`	绘制时使条形矩形膨胀的像素数量。
`pointStyle`	`string`\|`Image`\|`HTMLCanvasElement`	`'circle'`	图例点的样式。

# 圆弧配置

¥Arc Configuration

圆弧用于极图、圆环图和饼图。

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

命名空间：options.elements.arc、全局弧选项：Chart.defaults.elements.arc。

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

名称	类型	默认	描述
`angle` - 仅适用于极地	`number`	`circumference / (arc count)`	要覆盖的弧角。
`backgroundColor`	`Color`	`Chart.defaults.backgroundColor`	圆弧填充颜色。
`borderAlign`	`'center'`\|`'inner'`	`'center'`	弧线对齐。
`borderColor`	`Color`	`'#fff'`	弧线描边颜色。
`borderDash`	`number[]`	`[]`	弧线破折号。见 MDN (opens new window)。
`borderDashOffset`	`number`	`0.0`	弧线虚线偏移。见 MDN (opens new window)。
`borderJoinStyle`	`'round'`\|`'bevel'`\|`'miter'`	`'bevel'`\|`'round'`	线连接样式。见 MDN (opens new window)。`borderAlign` 为 `'inner'` 时默认为 `'round'`
`borderWidth`	`number`	`2`	弧线宽度。
`circular`	`boolean`	`true`	默认情况下，弧是弯曲的。如果 `circular: false` 则圆弧将是平坦的