# 线性径向轴
¥Linear Radial Axis
线性径向刻度用于绘制数值数据图表。顾名思义,线性插值用于确定值相对于轴中心的位置。
¥The linear radial scale is used to chart numerical data. As the name suggests, linear interpolation is used to determine where a value lies in relation to the center of the axis.
径向线性标尺提供以下附加配置选项。
¥The following additional configuration options are provided by the radial linear scale.
# 配置选项
¥Configuration Options
# 线性径向轴特定选项
¥Linear Radial Axis specific options
命名空间:options.scales[scaleId]
¥Namespace: options.scales[scaleId]
名称 | 类型 | 默认 | 描述 |
---|---|---|---|
animate | boolean | true | 是否动画从中心缩放图表 |
angleLines | object | 角线配置。更多... | |
beginAtZero | boolean | false | 如果为 true,则 scale 将包括 0(如果尚未包括)。 |
pointLabels | object | 点标签配置。更多... | |
startAngle | number | 0 | 刻度的起始角度。以度为单位,0 在顶部。 |
# 所有轴的通用选项
¥Common options for all axes
命名空间:options.scales[scaleId]
¥Namespace: options.scales[scaleId]
名称 | 类型 | 默认 | 描述 |
---|---|---|---|
type | string | 使用的规模类型。可以使用字符串键创建和注册自定义比例。这允许更改图表的轴类型。 | |
alignToPixels | boolean | false | 将像素值与设备像素对齐。 |
backgroundColor | Color | 比例区域的背景颜色。 | |
display | boolean |string | true | 控制坐标轴全局可见性(true 时可见,false 时隐藏)。当 display: 'auto' 时,仅当至少一个关联数据集可见时,轴才可见。 |
grid | object | 网格线配置。更多... | |
min | number | 用户定义的最小比例数,覆盖数据中的最小值。更多... | |
max | number | 用户定义的最大比例数,覆盖数据中的最大值。更多... | |
reverse | boolean | false | 反转比例。 |
stacked | boolean |string | false | 数据是否应该堆叠。更多... |
suggestedMax | number | 计算最大数据值时使用的调整。更多... | |
suggestedMin | number | 计算最小数据值时使用的调整。更多... | |
ticks | object | 勾选配置。更多... | |
weight | number | 0 | 用于对轴进行排序的权重。权重越高,离图表区域越远。 |
# 刻度配置
¥Tick Configuration
# 线性径向轴特定刻度选项
¥Linear Radial Axis specific tick options
命名空间:options.scales[scaleId].ticks
¥Namespace: options.scales[scaleId].ticks
名称 | 类型 | 可编写脚本 | 默认 | 描述 |
---|---|---|---|---|
count | number | 是的 | undefined | 要生成的分时数。如果指定,这将覆盖自动生成。 |
format | object | 是的 | 默认标签格式化程序使用的 Intl.NumberFormat (opens new window) 选项 | |
maxTicksLimit | number | 是的 | 11 | 要显示的最大刻度线和网格线数。 |
precision | number | 是的 | 如果已定义且未指定 stepSize ,则步长将四舍五入到这么多小数位。 | |
stepSize | number | 是的 | 用户定义的比例固定步长。更多... |
# 所有轴的通用刻度选项
¥Common tick options to all axes
命名空间:options.scales[scaleId].ticks
¥Namespace: options.scales[scaleId].ticks
名称 | 类型 | 可编写脚本 | 默认 | 描述 |
---|---|---|---|---|
backdropColor | Color | 是的 | 'rgba(255, 255, 255, 0.75)' | 标签背景的颜色。 |
backdropPadding | Padding | 2 | 标签背景的填充。 | |
callback | function | 返回应显示在图表上的刻度值的字符串表示形式。见 callback。 | ||
display | boolean | true | 如果为真,则显示刻度标签。 | |
color | Color | 是的 | Chart.defaults.color | 刻度的颜色。 |
font | Font | 是的 | Chart.defaults.font | 见 字体 |
major | object | {} | 主要刻度配置。 | |
padding | number | 3 | 设置刻度标签相对于轴的偏移量 | |
showLabelBackdrop | boolean | 是的 | true 用于径向刻度,false 否则 | 如果为真,则在刻度标签后面绘制背景。 |
textStrokeColor | Color | 是的 | `` | 文本周围笔划的颜色。 |
textStrokeWidth | number | 是的 | 0 | 文本周围的笔画宽度。 |
z | number | 0 | 刻度层的 z-index。在图表区域绘制刻度时很有用。值 <= 0 绘制在数据集下方, > 0 绘制在顶部。 |
可编写脚本的上下文在 选项 部分中进行了描述。
¥The scriptable context is described in Options section.
# 网格线配置
¥Grid Line Configuration
命名空间:options.scales[scaleId].grid
,它定义轴的网格线选项。
¥Namespace: options.scales[scaleId].grid
, it defines options for the grid lines of the axis.
名称 | 类型 | 可编写脚本 | 可转位 | 默认 | 描述 |
---|---|---|---|---|---|
borderDash | number[] | [] | 网格线上破折号的长度和间距。见 MDN (opens new window)。 | ||
borderDashOffset | number | 是的 | 0.0 | 虚线的偏移量。见 MDN (opens new window)。 | |
circular | boolean | false | 如果为 true,则网格线是圆形的(仅在雷达和极地区域图上)。 | ||
color | Color | 是的 | 是的 | Chart.defaults.borderColor | 网格线的颜色。如果指定为数组,则第一种颜色适用于第一条网格线,第二种颜色适用于第二条网格线,依此类推。 |
display | boolean | true | 如果为 false,则不显示该轴的网格线。 | ||
lineWidth | number | 是的 | 是的 | 1 | 网格线的笔划宽度。 |
可编写脚本的上下文在 选项 部分中进行了描述。
¥The scriptable context is described in Options section.
# 坐标轴范围设置
¥Axis Range Settings
考虑到轴范围设置的数量,了解它们如何相互作用是很重要的。
¥Given the number of axis range settings, it is important to understand how they all interact with each other.
suggestedMax
和 suggestedMin
设置仅更改用于缩放轴的数据值。这些对于扩展轴的范围同时保持自动适应行为非常有用。
¥The suggestedMax
and suggestedMin
settings only change the data values that are used to scale the axis. These are useful for extending the range of the axis while maintaining the auto-fit behaviour.
let minDataValue = Math.min(mostNegativeValue, options.ticks.suggestedMin);
let maxDataValue = Math.max(mostPositiveValue, options.ticks.suggestedMax);
在此示例中,最大正值是 50,但数据最大值扩展到 100。但是,由于最低数据值低于 suggestedMin
设置,因此将被忽略。
¥In this example, the largest positive value is 50, but the data maximum is expanded out to 100. However, because the lowest data value is below the suggestedMin
setting, it is ignored.
let chart = new Chart(ctx, {
type: 'radar',
data: {
datasets: [{
label: 'First dataset',
data: [0, 20, 40, 50]
}],
labels: ['January', 'February', 'March', 'April']
},
options: {
scales: {
r: {
suggestedMin: 50,
suggestedMax: 100
}
}
}
});
与 suggested*
设置相反,min
和 max
设置为轴设置了明确的端点。设置这些后,某些数据点可能不可见。
¥In contrast to the suggested*
settings, the min
and max
settings set explicit ends to the axes. When these are set, some data points may not be visible.
# 一步的大小
¥Step Size
如果设置,刻度刻度将按 stepSize
的倍数枚举,每个增量有一个刻度。如果未设置,则使用漂亮的数字算法自动标记刻度。
¥If set, the scale ticks will be enumerated by multiple of stepSize
, having one tick per increment. If not set, the ticks are labeled automatically using the nice numbers algorithm.
此示例设置了一个图表,其 y 轴在 0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5
处创建刻度。
¥This example sets up a chart with a y axis that creates ticks at 0, 0.5, 1, 1.5, 2, 2.5, 3, 3.5, 4, 4.5, 5
.
let options = {
scales: {
r: {
max: 5,
min: 0,
ticks: {
stepSize: 0.5
}
}
}
};
# 角线选项
¥Angle Line Options
以下选项用于配置从图表中心辐射到点标签的斜线。命名空间:options.scales[scaleId].angleLines
¥The following options are used to configure angled lines that radiate from the center of the chart to the point labels.
Namespace: options.scales[scaleId].angleLines
名称 | 类型 | 可编写脚本 | 默认 | 描述 |
---|---|---|---|---|
display | boolean | true | 如果为真,则显示角度线。 | |
color | Color | 是的 | Chart.defaults.borderColor | 斜线的颜色。 |
lineWidth | number | 是的 | 1 | 斜线的宽度。 |
borderDash | number[] | Yes1 | [] | 斜线上破折号的长度和间距。见 MDN (opens new window)。 |
borderDashOffset | number | 是的 | 0.0 | 虚线的偏移量。见 MDN (opens new window)。 |
borderDash
设置只接受静态值或函数。不支持传递数组数组。¥the
borderDash
setting only accepts a static value or a function. Passing an array of arrays is not supported.
可编写脚本的上下文在 选项 部分中进行了描述。
¥The scriptable context is described in Options section.
# 点标签选项
¥Point Label Options
以下选项用于配置显示在比例尺周边的点标签。命名空间:options.scales[scaleId].pointLabels
¥The following options are used to configure the point labels that are shown on the perimeter of the scale.
Namespace: options.scales[scaleId].pointLabels
名称 | 类型 | 可编写脚本 | 默认 | 描述 |
---|---|---|---|---|
backdropColor | Color | true | undefined | 点标签的背景颜色。 |
backdropPadding | Padding | 2 | 标签背景的填充。 | |
borderRadius | number |object | true | 0 | 点标签的边界半径 |
display | boolean |string | true | 如果为真,则显示点标签。当 display: 'auto' 时,如果标签与另一个标签重叠,则该标签被隐藏。 | |
callback | function | 将数据标签转换为点标签的回调函数。默认实现只返回当前字符串。 | ||
color | Color | 是的 | Chart.defaults.color | 标签的颜色。 |
font | Font | 是的 | Chart.defaults.font | 见 字体 |
padding | number | 是的 | 5 | 图表和点标签之间的填充。 |
centerPointLabels | boolean | false | 如果为真,则点标签居中。 |
可编写脚本的上下文在 选项 部分中进行了描述。
¥The scriptable context is described in Options section.
# 内部数据格式
¥Internal data format
在内部,线性径向刻度使用数字数据
¥Internally, the linear radial scale uses numeric data