自定义Highcharts工具提示

Question

我正在自定义Highcharts工具提示：

tooltip: {
    headerFormat: '<b>{series.name}</b><br>',
    pointFormat: 'round {point.x-9} to {point.x} avg: {point.y}'
}

但是{point.x-10}无法评估，我得到round 0 to 9 avg: 0.1而不是得到round to 9 avg: 0.1。

我该如何解决？

Answer 1

Highcharts不允许您在大括号中执行JS代码。在API中，我们可以阅读：

  

pointFormat：字符串：工具提示中该点所在行的HTML。变量用大括号括起来。可用变量为point.x，point.y，系列。名称和series.color和其他属性在同一表格上。

您应使用formatter属性：

tooltip: {
  headerFormat: '<b>{series.name}</b><br>',
  formatter: function() {
    return 'round ' + (this.x - 9) + ' to ' + this.x + ' avg: ' + this.y
  }
}

实时演示：http://jsfiddle.net/BlackLabel/8xn5sv3t/

API：https://api.highcharts.com/highcharts/tooltip.pointFormat