HighCharts:重复类别值。工具提示未显示正确的日期

时间:2016-06-07 13:15:04

标签: javascript highcharts scatter-plot

我正在使用highchart.js绘制散点图。

X轴:“服务器”[服务器列表“17.0.0.1”,“17.0.0.2”,“17.0.0.3”,“17.0.0.4”。 Y轴:“DateTime”{最后5天,间隔为6小时}

基本上,服务器在给定的一天多次刷新,数据被捕获并保存到数据库中。 该图表将读取数据库表数据并绘制图表。

现在,为了简单起见,我在这里进行了硬编码和显示。

这是JSBIN的链接。 http://jsbin.com/joxacen/2/edit?js,output

  1. 重复类别“17.0.0.3”和“17.0.0.4”。我不想重复这个。怎么解决这个?请找到重复值的图像。
  2. 未为服务器17.0.0.1绘制以下日期 ['Server 17.0.0.1',Date.UTC(2016,5,2,20,0,0)],//未画6月2日 ['Server 17.0.0.1',Date.UTC(2016,5,4,11,0,0)],//未画6月4日
  3. 工具提示显示一些垃圾数据。理想情况下,它应该显示日期。
  4. Repeated values are encircled here

1 个答案:

答案 0 :(得分:3)

这种情况正在发生,因为您的系列数据数组按顺序包含服务器(重复)。因此它会覆盖xAxis.categories设置。要使用预定义类别执行此操作,请将数据阵列中的x值条目更改为所需类别中的服务器索引:

series: [{
  name: 'In-Correct Server Refresh',
  color: 'rgba(223, 83, 83, .5)',
  data: [
         [0,   Date.UTC(2016,  5, 2, 10, 0, 0)],
         [0,   Date.UTC(2016,  5, 2, 20, 0, 0)], //not painted june 2nd
         [1,   Date.UTC(2016,  5, 4, 10, 0, 0)],
         [0,   Date.UTC(2016,  5, 4, 11, 0, 0)], //not painted june 4th
         [2,   Date.UTC(2016,  5, 4, 17, 0, 0)],
         [3,   Date.UTC(2016,  5, 4, 11, 30, 0)],
         [3,   Date.UTC(2016,  5, 4, 12, 0, 0)]
        ]   
}, {
  name: 'Correct Server Refresh',
  color: 'rgba(119, 152, 191, .5)',
  data: [
         [1,   Date.UTC(2016,  5, 3, 5, 0, 0)],
         [1,   Date.UTC(2016,  5, 3, 12, 0, 0)],
         [1,   Date.UTC(2016,  5, 3, 17, 0, 0)],
         [0,   Date.UTC(2016,  5, 5, 18, 0, 0)],
         [2,   Date.UTC(2016,  5, 5, 18, 0, 0)]
        ]
}]

您的工具提示存在的问题是,您的商家位于plotOptions下的无效位置。它需要位于图表对象的plotOptions.scatter或根目录内。请参阅此示例fiddle。我不知道你为什么要在服务器的IP之后附加%符号,但是你去了。