highcharts pass multiple values to tooltip

devmonster picture devmonster · Jul 2, 2012 · Viewed 40.3k times · Source

I need to display 3 values on the tooltip: the time, the value and another value(change).

I saw this example (but the jsdfiddle is not working).

I tried this

//each loop..
indice.push(["time", "value1", "value2"]);

, the tooltip settings

tooltip:
    {
    useHTML: true,
    formatter: function()
    {
      return '' + Highcharts.dateFormat('%H:%M:%S', this.x) +'; '+ this.y + this.z(<-is this right?);
    }
},

and the series

series:
[{
    type: 'area',
    data: indice
}]

can somone help pls? thsnks.

Answer

Linger picture Linger · Jul 2, 2012

If you want to pass additional data for a point other than the x and y values, then you have to name that value. In the following example I add the following three additional values to each data point:

{
  y: 3,
  locked: 1,
  unlocked: 1,
  potential: 1,
}

Then to access and display those values in the tooltip I use the following:

tooltip: 
{
     formatter: function() { return ' ' +
        'Locked: ' + this.point.locked + '<br />' +
        'Unlocked: ' + this.point.unlocked + '<br />' +
        'Potential: ' + this.point.potential;
     }
}