Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

A different suffix for each line on Highstock/Highcharts

Is there a easy way to use different suffix values on each line?

Right now I have 3 lines, I'm trying to change the suffix for each, but I was only able to find it using the formatter function.

But if I use the formatter function I need to edit every tooltip, make it just like the default one, and I don't know the default format.

I mean, a easy way like changing colors, what we can simply do:

{
name: 'First line',
type: 'line',
color: '#33CC66',
zIndex: 0,
data: [ ... ]
}
like image 948
saulob Avatar asked Mar 27 '13 19:03

saulob


1 Answers

I think this is what you want. You can specify the tooltip attribute on each series and use valueSuffix :

http://jsfiddle.net/aXvcw/

        tooltip: {
            formatter : function() {
                 return this.y + ' ' +  this.series.tooltipOptions.valueSuffix;
            }
        },
        series: [{
            name: 'Rainfall',
            type: 'column',
            yAxis: 1,
            data: [49.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
            tooltip: {
                valueSuffix: ' mm'
            }

        }, {
            name: 'Temperature',
            type: 'spline',
            data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6],
            tooltip: {
                valueSuffix: '°C'
            }
        }]

Modified from this demo: http://www.highcharts.com/demo/combo-dual-axes.

You don't need to provide the tooltip formatter function either, but if you wanted other than the default, that is how you could access the series valueSuffix.

like image 77
Scott Gearhart Avatar answered Oct 23 '22 03:10

Scott Gearhart