How to show tooltip data below each column in Highchart? - highcharts

Question

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.

Answer 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