HighCharts 子弹图展示目标的数据标签

Question

我使用 Highchart 项目符号模块创建多项目符号图表（水平或垂直）。此处的图表示例：https://jsfiddle.net/vegaelce/n5wjaf2e/

我可以使用以下选项为主要度量值添加数据标签：

plotOptions: {
        series: {           
            dataLabels: {
                enabled: true,
                inside: true
            },

但我想显示主要度量的标签和目标的标签，但是没有添加目标度量的数据标签的选项（我的 jsfiddle 上的橙色勾号度量）。

我该怎么做？

提前致谢

Answer 1

您可以将dataLabels配置定义为一个对象数组，这意味着可以添加多个dataLabel，接下来使用dataLabels.formatter回调到return 目标值。

  dataLabels: [{
    enabled: true,
    inside: true
  }, {
    enabled: true,
    formatter() {
        //console.log(this)
        return this.point.target
    }
}],

演示：https://jsfiddle.net/BlackLabel/2fxL03gz/

API: https://api.highcharts.com/highcharts/series.line.dataLabels.formatter

HighCharts 子弹图展示目标的数据标签

HighCharts Bullet Chart display data label of the target

javascript

label

bullet

target

highcharts