我有一个Highchart图,其中xAxis是日期时间,在yAxis上我有不同的数据。我想在“最小值”和“最大值”上放置标记,但是对于每个系列的数据都会显示标记,以及如何修复它。 谢谢。
Flags show up for each series of data
我要这样显示Highchart
Flags show up only single series of data what I'm expected
这是我的代码:
var newArr = [];
Highcharts.chart('container', {
chart: {
type: 'spline',
events: {
load: function(){
var chart = this;
for(var i = 0; i < chart.series[0].processedXData.length; i++){
newArr.push({
y: chart.series[0].processedYData[i],
x: chart.series[0].processedXData[i]
})
var maxY = Math.max.apply(Math, newArr.map(function(o){
return o.y
}));
var minY = Math.min.apply(Math, newArr.map(function (o) {
return o.y;
}));
maxIndex = newArr.findIndex(x => x.y == maxY);
minIndex = newArr.findIndex(x => x.y == minY);
this.addSeries({
type: 'flags',
data: [{
x: newArr[maxIndex].x,
y: newArr[maxIndex].y,
title: 'Max:' + newArr[maxIndex].y,
}, {
x: newArr[minIndex].x,
y: newArr[minIndex].y,
title: 'Min: ' + newArr[minIndex].y,
}],
});
}
}
}
},
title: {
text: 'Steps by Day'
},
xAxis: {
type: 'datetime',
tickInterval: 3600000
},
yAxis: {
title: {
text: 'Steps'
},
},
series: [{
name: 'Steps',
data: [[1560297675000, 4.0], [1560300046000, 4.0], [1560302158000, 1.0], [1560302865000, 1.0], [1560303544000, 3.0], [1560305303000, 11.0], [1560305640000, 10.0], [1560306856000, 17.0], [1560307167000, 10.0], [1560308973000, 24.0], [1560309641000, 12.0], [1560309941000, 22.0], [1560310243000, 6.0], [1560310886000, 5.0], [1560312466000, 19.0], [1560313206000, 155.0], [1560314359000, 26.0], [1560316400000, 343.0], [1560318218000, 64.0], [1560319682000, 353.0], [1560325074000, 96.0], [1560326743000, 1037.0]]
}]});
答案 0 :(得分:0)
您只需要添加一个flag
系列:
chart: {
type: 'spline',
events: {
load: function() {
var series = this.series[0],
yData = series.yData,
min = Math.min(...yData),
max = Math.max(...yData),
x1 = series.points[yData.indexOf(min)].x,
x2 = series.points[yData.indexOf(max)].x;
this.addSeries({
type: 'flags',
data: [{
x: x1,
y: min,
title: 'Min: ' + min
}, {
x: x2,
y: max,
title: 'Max:' + max
}]
});
}
}
}