我有一个highstocks散点图,在系列数据初始化后,我使用addSeries添加了一条最佳拟合线(一旦我计算了端点)。
我遇到的问题是,当我添加新系列时,xAxis日期时间标签全部消失(它们最初是正确绘制的)。似乎是因为新系列只有两个点,图表重新绘制xAxis以迎合新系列,并仅使用一个日期时间标签绘制它。
看起来非常类似于this问题,这个问题从未解决
我怎样才能避免这种情况发生?
我无法分享我的实际代码,因为它嵌入在专有框架上的Java小部件中,但this Fiddle显示相同的行为
Highcharts.chart('container', {
chart: {
type: 'scatter',
zoomType: 'x'
},
title: {
text: 'Random data'
},
xAxis: {
title: {
enabled: true,
text: 'Height (cm)'
},
type: 'datetime' //,
// startOnTick: true,
// endOnTick: true,
// showLastLabel: true
},
exporting: {
buttons: {
customButton: {
text: 'Add Series',
onclick: function() {
var newRegressionLineSeries = {
type: 'line',
name: 'Line series',
data: [
[Date.UTC(2015, 2, 26), 0.8],
[Date.UTC(2015, 6, 28), 0.7]
],
marker: {
enabled: false
},
states: {
hover: {
lineWidth: 0
}
},
enableMouseTracking: false
};
this.addSeries(newRegressionLineSeries);
}
}
}
},
plotOptions: {
scatter: {
marker: {
radius: 5,
states: {
hover: {
enabled: true,
lineColor: 'rgb(100,100,100)'
}
}
},
states: {
hover: {
marker: {
enabled: false
}
}
},
tooltip: {
headerFormat: '<b>{series.name}</b><br>',
pointFormat: '{point.x} cm, {point.y} kg'
}
}
},
series: [{
name: 'Data',
color: 'rgba(223, 83, 83, .5)',
data: [
[Date.UTC(2015, 2, 26), 0.9188],
[Date.UTC(2015, 2, 27), 0.9184],
[Date.UTC(2015, 2, 29), 0.9188],
[Date.UTC(2015, 2, 30), 0.9231],
[Date.UTC(2015, 2, 31), 0.9319],
[Date.UTC(2015, 3, 1), 0.9291],
[Date.UTC(2015, 3, 2), 0.9188],
[Date.UTC(2015, 3, 3), 0.9109],
[Date.UTC(2015, 3, 5), 0.9091],
[Date.UTC(2015, 3, 6), 0.9154],
[Date.UTC(2015, 3, 7), 0.9246],
[Date.UTC(2015, 3, 8), 0.9276],
[Date.UTC(2015, 3, 9), 0.9382],
[Date.UTC(2015, 3, 10), 0.9431],
[Date.UTC(2015, 3, 12), 0.9426],
[Date.UTC(2015, 3, 13), 0.9463],
[Date.UTC(2015, 3, 14), 0.9386],
[Date.UTC(2015, 3, 15), 0.9357],
[Date.UTC(2015, 3, 16), 0.9293],
[Date.UTC(2015, 3, 17), 0.9254],
[Date.UTC(2015, 3, 19), 0.9251],
[Date.UTC(2015, 3, 20), 0.9312],
[Date.UTC(2015, 3, 21), 0.9315],
[Date.UTC(2015, 3, 22), 0.9323],
[Date.UTC(2015, 3, 23), 0.9236],
[Date.UTC(2015, 3, 24), 0.9196],
[Date.UTC(2015, 3, 26), 0.9201],
[Date.UTC(2015, 3, 27), 0.9184],
[Date.UTC(2015, 3, 28), 0.9106],
[Date.UTC(2015, 3, 29), 0.8983],
[Date.UTC(2015, 3, 30), 0.8909],
[Date.UTC(2015, 4, 1), 0.8928],
[Date.UTC(2015, 4, 3), 0.8941],
[Date.UTC(2015, 4, 4), 0.8972],
[Date.UTC(2015, 4, 5), 0.8940],
[Date.UTC(2015, 4, 6), 0.8808],
[Date.UTC(2015, 4, 7), 0.8876],
[Date.UTC(2015, 4, 8), 0.8925],
[Date.UTC(2015, 4, 10), 0.8934],
[Date.UTC(2015, 4, 11), 0.8964],
[Date.UTC(2015, 4, 12), 0.8917],
[Date.UTC(2015, 4, 13), 0.8805],
[Date.UTC(2015, 4, 14), 0.8764],
[Date.UTC(2015, 4, 15), 0.8732],
[Date.UTC(2015, 4, 17), 0.8737],
[Date.UTC(2015, 4, 18), 0.8838],
[Date.UTC(2015, 4, 19), 0.8969],
[Date.UTC(2015, 4, 20), 0.9014],
[Date.UTC(2015, 4, 21), 0.8999],
[Date.UTC(2015, 4, 22), 0.9076],
[Date.UTC(2015, 4, 24), 0.9098],
[Date.UTC(2015, 4, 25), 0.9110],
[Date.UTC(2015, 4, 26), 0.9196],
[Date.UTC(2015, 4, 27), 0.9170],
[Date.UTC(2015, 4, 28), 0.9133],
[Date.UTC(2015, 4, 29), 0.9101],
[Date.UTC(2015, 4, 31), 0.9126],
[Date.UTC(2015, 5, 1), 0.9151],
[Date.UTC(2015, 5, 2), 0.8965],
[Date.UTC(2015, 5, 3), 0.8871],
[Date.UTC(2015, 5, 4), 0.8898],
[Date.UTC(2015, 5, 5), 0.8999],
[Date.UTC(2015, 5, 7), 0.9004],
[Date.UTC(2015, 5, 8), 0.8857],
[Date.UTC(2015, 5, 9), 0.8862],
[Date.UTC(2015, 5, 10), 0.8829],
[Date.UTC(2015, 5, 11), 0.8882],
[Date.UTC(2015, 5, 12), 0.8873],
[Date.UTC(2015, 5, 14), 0.8913],
[Date.UTC(2015, 5, 15), 0.8862],
[Date.UTC(2015, 5, 16), 0.8891],
[Date.UTC(2015, 5, 17), 0.8821],
[Date.UTC(2015, 5, 18), 0.8802],
[Date.UTC(2015, 5, 19), 0.8808],
[Date.UTC(2015, 5, 21), 0.8794],
[Date.UTC(2015, 5, 22), 0.8818],
[Date.UTC(2015, 5, 23), 0.8952],
[Date.UTC(2015, 5, 24), 0.8924],
[Date.UTC(2015, 5, 25), 0.8925],
[Date.UTC(2015, 5, 26), 0.8955],
[Date.UTC(2015, 5, 28), 0.9113],
[Date.UTC(2015, 5, 29), 0.8900],
[Date.UTC(2015, 5, 30), 0.8950],
[Date.UTC(2015, 6, 1), 0.8950],
[Date.UTC(2015, 6, 2), 0.8750],
[Date.UTC(2015, 6, 3), 0.8650],
[Date.UTC(2015, 6, 4), 0.8550],
[Date.UTC(2015, 6, 5), 0.8150],
[Date.UTC(2015, 6, 6), 0.8100],
[Date.UTC(2015, 6, 7), 0.8070],
[Date.UTC(2015, 6, 8), 0.8050],
[Date.UTC(2015, 6, 9), 0.7990],
[Date.UTC(2015, 6, 10), 0.7900],
[Date.UTC(2015, 6, 11), 0.7850],
[Date.UTC(2015, 6, 12), 0.7800],
[Date.UTC(2015, 6, 13), 0.7750],
[Date.UTC(2015, 6, 14), 0.7700],
[Date.UTC(2015, 6, 15), 0.7650],
[Date.UTC(2015, 6, 16), 0.7600],
[Date.UTC(2015, 6, 17), 0.7550],
[Date.UTC(2015, 6, 18), 0.7500],
[Date.UTC(2015, 6, 19), 0.7450],
[Date.UTC(2015, 6, 20), 0.7400],
[Date.UTC(2015, 6, 21), 0.7350],
[Date.UTC(2015, 6, 22), 0.7250],
[Date.UTC(2015, 6, 23), 0.7150],
[Date.UTC(2015, 6, 24), 0.7050],
[Date.UTC(2015, 6, 25), 0.6900],
[Date.UTC(2015, 6, 26), 0.6750],
[Date.UTC(2015, 6, 27), 0.6600],
[Date.UTC(2015, 6, 28), 0.6300],
]
}]
});
答案 0 :(得分:0)
一个简单的解决方法是创建一个新轴并在该轴上放置不足的点。
我通过以下方式更新了您提供的小提琴:
添加新的xAxis:
xAxis: [{
id: '0',
title: {
enabled: true,
text: 'Height (cm)'
},
type: 'datetime'
},{
id: '1', //new axis ID
type: 'datetime',
visible: false,
linkedTo: '0'
}],
新行添加到新的xAxis:
var newRegressionLineSeries = {
xAxis: '1', //Added this
type: 'line',
...
}