如何在Highchart中的每列下方显示工具提示数据？

本文介绍了如何在Highchart中的每列下方显示工具提示数据？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述 当我将鼠标悬停在它上方时，工具提示有一些数据，例如在x标签所在的列下面显示的数据，现在它显示0,1,2，所以在highchart中的工具提示数据是可见的

我使用图表来比较时间段，所以在每一列我想从工具提示添加数据。这可能是我比较每列下面的2个日期，一张照片会对你有所帮助，但我不是一个值得信任的计算器用户。

解决方案

使用 datetime xAxis 类型：

小提琴：

• 另外一个使用类别的版本：

  • 这也可能是分组分类插件的一种情况： .highcharts / plugin-registry / single / 11 / Grouped-Categoriesrel =nofollow noreferrer> www.highcharts/plugin-registry/single/11/Grouped-Categories

  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.

  解决方案

  An example using a datetime xAxis type:

  Fiddle:

  • jsfiddle/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:

  • jsfiddle/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:

  • jsfiddle/jlbriggs/1bs6vL3t/5/

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

  • www.highcharts/plugin-registry/single/11/Grouped-Categories