代码之家 › 专栏 › 技术社区 › emihir0

如何动态显示所有可见序列数据的总和

highcharts

0

emihir0 · 技术社区 · 7 年前

在任何给定时间,如何在海图中显示所有可见系列数据的总和?例如,给出此图表:

https://jsfiddle.net/8xmw2nj6/2/

它显示了一个简单的带向下钻取的堆积柱形图。我想要的是默认情况下它应该显示“14879”值。随着可见序列/向下钻取的更改,它应该更新此值。例如,这个值可以显示在图表标题中。

你知道怎么做吗?

重要原因示例: 显示(给定年份)总销售额12个月细分的柱形图。我们可以看到每个月的销售额,但知道总额也很重要。只突出显示特定客户的系列-同样,我们也希望知道系列的总价值,而不仅仅是每月的细分。

我知道我们可以用 setTitle :

chart.setTitle(total);

但是我不知道在哪里包含这个功能以及如何计算只有可见系列的总数。

1 回复 | 直到 7 年前

1

2

ewolden 7 年前

你可以通过使用 setTitle 函数和 render 类似事件:

chart: {
  events: {
    render: function() {
      let series = this.series
      let sum = 0
      for(let i = 0; i < series.length; i++) {
        if(series[i].visible){
          for(let j = 0; j < series[i].data.length; j++) {
            sum += series[i].data[j].y
          }
        }
      }
    this.setTitle({text: "Production Orders, sum: " + sum}, false, false) 
    }
  }
},

这将计算所有 看得见的 系列,任何时候。

要格式化标题中的数字,可以使用 Highcharts.numberFormat(number, decimals [, decimalPoint] [, thousandsSep]) 它将格式化的数字返回为字符串而不是整数 sum .

工作示例: https://jsfiddle.net/ewolden/y03qjbhk/1/

呈现事件时的API: https://api.highcharts.com/highcharts/chart.events.render