# 选项

# 选项解析

选项从上到下解析,使用与上下文相关的路径。

# 图表级选项

  • options
  • overrides[config.type]
  • defaults

# 数据集级选项

dataset.type 默认值是 config.type,如果未指定。

  • dataset
  • options.datasets[dataset.type]
  • options
  • overrides[config.type].datasets[dataset.type]
  • defaults.datasets[dataset.type]
  • defaults

# 数据集动画选项

  • dataset.animation
  • options.datasets[dataset.type].animation
  • options.animation
  • overrides[config.type].datasets[dataset.type].animation
  • defaults.datasets[dataset.type].animation
  • defaults.animation

# 数据集元素级选项

每个作用域都会先在选项名称中查找带有 elementType 前缀,然后查找不带前缀的名称。例如,point 元素的 radius 会使用 pointRadius 查找,如果未命中,则使用 radius 查找。

  • dataset
  • options.datasets[dataset.type]
  • options.datasets[dataset.type].elements[elementType]
  • options.elements[elementType]
  • options
  • overrides[config.type].datasets[dataset.type]
  • overrides[config.type].datasets[dataset.type].elements[elementType]
  • defaults.datasets[dataset.type]
  • defaults.datasets[dataset.type].elements[elementType]
  • defaults.elements[elementType]
  • defaults

# 刻度选项

  • options.scales
  • overrides[config.type].scales
  • defaults.scales
  • defaults.scale

# 插件选项

插件可以提供 additionalOptionScopes 数组,包含其选项需要额外查找的路径。对于根作用域,使用空字符串:''。大多数核心插件也从根作用域获取选项。

  • options.plugins[plugin.id]
  • (options.[...plugin.additionalOptionScopes])
  • overrides[config.type].plugins[plugin.id]
  • defaults.plugins[plugin.id]
  • (defaults.[...plugin.additionalOptionScopes])

# 可脚本化选项

可脚本化选项也接受一个函数,该函数对每个基础数据值进行调用,并接受一个唯一的参数 context,表示上下文信息(请参阅 选项上下文)。一个解析器作为第二个参数传递,它可以用来访问相同上下文中的其他选项。

注意

在可脚本化函数中应该验证 context 参数,因为该函数可以在不同的上下文中调用。type 字段是进行这种验证的一个好选择。

示例

color: function(context) {
    const index = context.dataIndex;
    const value = context.dataset.data[index];
    return value < 0 ? 'red' :  // draw negative values in red
        index % 2 ? 'blue' :    // else, alternate values in blue and green
        'green';
},
borderColor: function(context, options) {
    const color = options.color; // resolve the value of another scriptable option: 'red', 'blue' or 'green'
    return Chart.helpers.color(color).lighten(0.2);
}

# 可索引选项

可索引选项也接受一个数组,其中每个项目对应于相同索引处的元素。请注意,如果项目的数量少于数据的数量,则会循环使用这些项目。在许多情况下,如果支持,使用 函数 更为合适。

示例

color: [
    'red',    // color for data at index 0
    'blue',   // color for data at index 1
    'green',  // color for data at index 2
    'black',  // color for data at index 3
    //...
]

# 选项上下文

选项上下文用于在解析选项时提供上下文信息,目前仅适用于 可脚本化选项。该对象被保留,因此它可以用于在调用之间存储和传递信息。

有多个级别的上下文对象

  • chart
    • dataset
      • data
    • scale
      • tick
      • pointLabel(仅在径向线性刻度中使用)
    • tooltip

每个级别都继承其父级,并且在父级中存储的任何上下文信息都可以通过子级访问。

上下文对象包含以下属性

# chart

  • chart:关联的图表
  • type'chart'

# dataset

除了 chart

  • active:如果元素处于活动状态(悬停)则为 true
  • dataset:索引为 datasetIndex 的数据集
  • datasetIndex:当前数据集的索引
  • index:与 datasetIndex 相同
  • mode:更新模式
  • type'dataset'

# data

除了 dataset

  • active:如果元素处于活动状态(悬停)则为 true
  • dataIndex:当前数据的索引
  • parsed:给定 dataIndexdatasetIndex 的解析数据值
  • raw:给定 dataIndexdatasetIndex 的原始数据值
  • element:此数据的元素(点、弧、条形等)
  • index:与 dataIndex 相同
  • type'data'

# scale

除了 chart

  • scale:关联的刻度
  • type'scale'

# tick

除了 scale

  • tick:关联的刻度对象
  • index:刻度索引
  • type'tick'

# pointLabel

除了 scale

  • label:关联的标签值
  • index:标签索引
  • type'pointLabel'

# tooltip

除了 chart

  • tooltip:提示对象
  • tooltipItems:提示正在显示的项目
上次更新时间: 2024/5/17 下午 12:33:38