Question

例如，如果我有一个包含三个系列的图表并且工具提示设置为共享，我希望能够更好地控制工具提示的格式化。目前我使用formatter：somefunction（）并创建我自己的html以在显示的工具提示中使用。现在这个工作非常好，但现在我想知道格式化函数何时触发我所在的系列，以便在工具提示中的三个系列中我可以相应地格式化我显示的文本。

共享工具提示：

标题标签

  Series 1
  Series 2 (If I am hovering over this item I want to bold it in the formatter function)
  Series 3

Answer 1

共享工具提示中没有此类信息 - 只需将空格悬停在图表上（无系列）并显示，请参阅：http://jsfiddle.net/LBsL5/

可能对您有用的解决方案是禁用共享工具提示并使用以下命令从其他系列中获取值：

var xIndex = this.series.xData.indexOf(this.x),
    allSeries = this.series.chart.series;

现在遍历所有系列并使用allSeries[index].yData[xIndex]从每个系列中获取值。

当然，如果this.series.index（或this.series.options.index）与上述index相同，则生成粗体文字。

Answer 2

感谢您的指示。我在这里发布完整的代码来实现这一点。希望它能帮助别人。

// Header for tooltip.
// This row consists of bold text, with the text being the xAxis Label 
// that the Series falls in followed by the Chart Title.
var toolTip = '<b>' + this.x + ' ' + chartTitle + '</b><br/>';

// Get the current index in the Series you are hovering over.
var xIndex = this.series.xData.indexOf(this.point.x);

// Get all the Series represented in the Chart.
var allSeries = this.series.chart.series;

// Loop over each Series.
for (var index = 0; index < allSeries.length; index++) {
    // Get the value from each Series.
    var yDataValue = allSeries[index].yData[xIndex];

    // Check if this is the same as index and if it is then you are 
    // hovering over the point that needs the text in the formatted tooltip in bold for that Series.
    if (this.series.index === index || this.series.options.index === index) {
        //
        // Generate Bold Text here.
        //

        toolTip = toolTip + '<b>' + allSeries[index].name + ': ' + yDataValue + '</b>';
    }
    else {
        toolTip = toolTip + allSeries[index].name + ': ' + yDataValue;
    }
}

共享工具提示的Highcharts Tooltip格式

2 个答案: