highcharts为单点自定义工具提示

时间:2013-08-07 22:19:39

标签: highcharts customization tooltip

我想自定义特定系列中最后一个点的工具提示,保留本系列中的其他点以及其他系列,使用默认的工具提示格式。基本上,我正在寻找类似于这个配置的东西。在此先感谢您的帮助!

series: [{
            tooltip: {    // ?? tooltip does not work inside series
                formatter: function() {
                    if (lastPoint in the series) {  // ?? how to determine if lastPoint
                        return '<b>Final result is </b> ' + this.y;
                    }
                    // ?? return default format if it is not the last point in the series
                }
            },            
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6]        
        }, {
            data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2]        
        }]

1 个答案:

答案 0 :(得分:16)

格式化程序函数在为系列定义时似乎不起作用。您可以使用this.series.name检查您所在的系列,然后使用this.series.xData.length - 1 == this.point.x检查您是否在最后一个点。但是,更容易命名要定位的点并在formatter函数中检查它。 http://jsfiddle.net/Swsbb/。要查看所有格式化程序数据,请点击此处http://api.highcharts.com/highcharts#tooltip.formatter

$('#container').highcharts({   
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul']
    },
    tooltip : {
        formatter: function() {
            var tooltip;
            if (this.key == 'last') {
                tooltip = '<b>Final result is </b> ' + this.y;
            }
            else {
                tooltip =  '<span style="color:' + this.series.color + '">' + this.series.name + '</span>: <b>' + this.y + '</b><br/>';
            }
            return tooltip;
        }
    },   
    series: [{
                data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, {y:135.6, name: 'last'}]

    },
    {
        data: [194.1, 95.6, 54.4, 29.9, 71.5, 106.4, 129.2]
    }]

});