高图表，检测点是否在堆栈中的第一个

Highcharts, detect if point is first in stack

本文关键字：堆栈 第一个 是否 检测 高图表      更新时间：2023-09-26

所以我有一个高图表，我想只在每个堆栈的第一个点上显示数据标签（即 0 点在哪里）

我的配置如下所示：

{
  chart: {type: 'bar'},
  plotOptions: {
    series: {
      stacking: 'percent',
      dataLabels: {
        enabled: true,
        allowOverlap: true,
        formatter: function () {
          if (pointIsFirstInStack(this)) {
            return labelFunction(this);
          }
          return '';
        }
      }
    }
  },
  series: [{
     name: 'Available',
     data: [
       {x: 'Event1', y: 18},
       {x: 'Event2', y: 20}
     ]
  }, {
    name: 'Purchased',
    data: [
      {x: 'Event1', y: 23},
      {x: 'Event2', y: 40}
    ]
  }]
}

但是我很难实现pointIsFirstInStack功能，有什么想法吗？

问候

埃纳尔

JSFiddle来说明我的图表：http://jsfiddle.net/qam37suh/

编辑：在配置示例中添加了系列和堆叠edit2：添加了 JSFiddle

您可以检查系列索引。

如果你总是要有两个系列，你可以这样检查它：

formatter: function(){
  return this.series.index == 1 ? this.x : null;
}

例：

  • http://jsfiddle.net/jlbriggs/jL6zrt7d/

默认情况下，Highcharts 反向堆叠序列，因此索引 0 堆叠在顶部。

如果要有一个动态的序列数，你可以先添加对序列数的检查，以便你仍然检查最后一个序列：

formatter: function(){
  var len = this.series.chart.series.length -1;
  return this.series.index == len ? this.x : null;
}

例：

  • http://jsfiddle.net/jlbriggs/jL6zrt7d/1/

（您也可以在yAxis上设置reversedStacks: false，而只是检查index == 0

例：

  • http://jsfiddle.net/jlbriggs/jL6zrt7d/3/

）

或者，如果您的目标是将类别放在系列内部而不是外部，则可以移动它们：

xAxis: {
  categories: ['Event1', 'Event2'],
  labels: {
    x: 60,
    style: {
      fontWeight: 'bold',
      color: 'rgba(255,255,255,0.75)'
    }
   }
 }

例：

  • http://jsfiddle.net/jlbriggs/jL6zrt7d/2/
相关文章：