【发布时间】：2019-09-24 14:45:51
【问题描述】：
我们有一个图表可以同时绘制多个系列。
有主要的 y 系列（线型）将具有主要数据读数。 也可以选择在 y 轴上设置两个不同的“级别”（线型）。 还可以选择拥有多个额外的 y 轴条（条类型）。 x 轴为日期时间
这是按预期工作的。 我们将主要的 y 系列作为平均空气温度（左 y 轴） 然后我们有两个条，一个用于降雨，一个用于灌溉（右 y 轴） 然后是两个“级别”，一红一蓝。
这一切都很棒。 但是，当我们转到没有空气温度数据的未来日期范围时，我们会得到以下信息 请注意，开始日期比日期范围早 2 天，结束日期看起来与“级别”结束的距离相等
有趣的是，如果我们删除这些条，我们会得到以下结果 现在显示跨越图表整个宽度的“级别”
如果我们删除线条并只保留条形，那么我们会得到以下内容（这应该是它的外观，但带有“级别”）
当有多个 y 系列而没有主 y 系列时，这里似乎有什么东西导致了冲突。
我将 xAxis.setExtremes 设置为我们正在查看的日期范围的开始日期和结束日期，但这似乎没有任何作用。
这里是配置；
{
"chart": {
"type":"line",
"animation": {
"duration":150
},
"events":{}
},
"credits":{
"enabled":false
},
"title":{
"text":""
},
"subtitle":{
"text":""
},
"tooltip":{
"shared":true,
"crosshairs":true,
"borderWidth":0,
"followPointer":true,
"useHTML":true,
"headerFormat":"<span style=\"font-size: 10px;\">{point.key}</span><br><br>"
},
"xAxis":[
{
"id":"x-axis",
"type":"datetime",
"crosshair":{
"snap":false
},
"title":{
"text":"25th Sep 2019 - 1st Oct 2019",
"margin":15
}
}
],
"yAxis":[
{
"id":"y-axis-sensors",
"title":{
"text":"ºC"
},
"reversed":false,
"visible":true,
"endOnTick":false,
"startOnTick":false,
"alignTicks":false
},
{
"id":"y-axis-moisture",
"title":{
"text":"mm"
},
"opposite":true,
"min":0,
"endOnTick":false,
"startOnTick":false,
"alignTicks":false,
"tickWidth":0,
"gridLineWidth":0
}
],
"series":[
{
"type":"line",
"yAxis":"y-axis-sensors",
"marker":{
"enabled":false
},
"lineWidth":1,
"animation":false,
"name":"Full",
"seriesGroup":"levelSeries",
"id":"series-level-range-full",
"color":"#31B5E0",
"showInLegend":false,
"states":{
"hover":{
"enabled":false
}
},
"enableMouseTracking":false,
"zIndex":5,
"step":true,
"data":[
[1569369600000,5],
[1569974400000,5]
]
},
{
"type":"line",
"yAxis":"y-axis-sensors",
"marker":{
"enabled":false
},
"lineWidth":1,
"animation":false,
"name":"Refill",
"seriesGroup":"levelSeries",
"id":"series-level-range-refill",
"color":"#D23333",
"showInLegend":false,
"states":{
"hover":{
"enabled":false
}
},
"enableMouseTracking":false,
"zIndex":5,
"step":true,
"data":[
[1569369600000,17],
[1569974400000,17]
]
},
{
"type":"column",
"yAxis":"y-axis-moisture",
"marker":{
"enabled":false
},
"name":"Rainfall",
"seriesGroup":"rainfallSeries",
"states":{
"hover":{
"enabled":false
}
},
"id":"series-rainfall",
"pointWidth":6,
"borderWidth":0,
"color":"rgba(41, 182, 246, 0.3)",
"data":[
[1569488400000,5]
],
"zIndex":10,
"stacking":"normal",
"stack":"moisture"
},
{
"type":"column",
"yAxis":"y-axis-moisture",
"marker":{
"enabled":false
},
"states":{
"hover":{
"enabled":false
}
},
"name":"Irrigation",
"seriesGroup":"irrigationSeries",
"id":"series-irrigation",
"pointWidth":6,
"borderWidth":0,
"color":"rgba(205,220,57, 0.3)",
"data":[[1569574800000,3]],
"zIndex":10,
"stacking":"normal",
"stack":"moisture"
}
]
}
对于为什么会发生这种情况，我有点不知所措。 任何人都可以对此有所了解吗？
【问题讨论】：
标签： highcharts