系列和标志的Highchart / stock工具提示格式化程序

时间:2012-05-10 13:57:03

标签: highcharts highstock

在以下示例中,如何格式化系列AND标志的工具提示?

http://jsfiddle.net/gh/get/jquery/1.7.1/highslide-software/highcharts.com/tree/master/samples/stock/plotoptions/flags/

我想在标题工具提示中显示系列工具提示和其他数据中的额外信息。

3 个答案:

答案 0 :(得分:11)

将以下功能用作工具提示格式化程序 -

tooltip: {
  shared:true,
formatter: function(){
        var p = '';
        console.log(this);

        if(this.point) {
          p += '<b>'+ Highcharts.dateFormat('%A, %b %e, %Y', this.point.x) +'</b><br/>';
          p += this.point.config.text // This will add the text on the flags
        }
        else {              
          p += '<b>'+ Highcharts.dateFormat('%A, %b %e, %Y', this.x) +'</b><br/>';
          $.each(this.points, function(i, series){
            p += '<span style="color:' + this.series.color + '">' + this.series.name + '</span>: <b>'+ this.y + ' kWh ($' + Highcharts.numberFormat(this.y * rate, 0) + ')</b><br/>';
          });

        }
        return p;
      }}

另请参阅此JSFiddle:http://jsfiddle.net/aTcFe/

答案 1 :(得分:8)

一种方法是创建一个工具提示格式化程序,用于检查当前对象是否为点。

tooltip: {
            formatter: function(){
                if(this.point) {
                    return "this is a flag"
                }
                else {
                    return "this is a line"
                }
            }                
        }

您可以更进一步,给出您的标志名称,然后检查该点是否有名称(而不是它是否存在),以防止非标记点获得相同的格式。

以下是您修改的示例,以反映前http://jsfiddle.net/aTcFe/

答案 2 :(得分:1)

使用Highstock 2.1.7,您总是会得到this.point个对象,因此您应该使用this.series.type === 'flags'来检测是否存在标记。

一个例子是:

formatter: function () {
     if (this.series.type === 'flags') {
          // Flags formatting
     }
     else {
          // Default formatting
     }
}