How to show tooltip data below each column in Highchart?

问题

The tooltip data in highchart is visible when i hover my mouse over it, the tooltip has some data that i want to show for example below the column where the x label is, for now it shows 0,1,2 and so on.

I am using the chart to compare timeperiods, so under each column i want to add data from the tooltip. It could be 2 dates I compare below each column, a picture would be helpful for you but i am not a trusted stackoverflow user yet.

回答1:

An example using a datetime xAxis type:

Fiddle:

http://jsfiddle.net/jlbriggs/1bs6vL3t/

Code:

In the xAxis properties, specify the type as datetime:

xAxis: {
  type: 'datetime'
},

In the series, specify your x values as dates (using either the Date.UTC() method, or by directly specifing epoch time)

series: [{
  data: [
    [Date.UTC(2016, 05, 6), 3],
    [Date.UTC(2016, 05, 13), 5],
    [Date.UTC(2016, 05, 20), 4],
    [Date.UTC(2016, 05, 27), 7],
    [Date.UTC(2016, 06, 4), 6],
    [Date.UTC(2016, 06, 11), 9],
    [Date.UTC(2016, 06, 18), 7],
    [Date.UTC(2016, 06, 25), 5]
  ]
}]

Output:

And, an alternative version that uses categories instead:

http://jsfiddle.net/jlbriggs/1bs6vL3t/2/

Generally, when working with time series data, using datetime is preferable. There may be cases where various circumstances make it less effective, in which case categories can be a useful alternative.

{{ Edit }} After re-reading your comments, here's another version, using categories, that might be more like what you're looking for:

http://jsfiddle.net/jlbriggs/1bs6vL3t/5/

This may also be a case for the Grouped Categories plugin:

http://www.highcharts.com/plugin-registry/single/11/Grouped-Categories

来源：https://stackoverflow.com/questions/38850836/how-to-show-tooltip-data-below-each-column-in-highchart

标签

Highcharts

tooltip

column-chart