如何使用Highcharts Js突出显示特定的点

Question

我有一个简单的Highchart与数据集多达1000个数据。只有y值，x值是自动生成的。此外，这些值来自我的nodejs服务器，所以请不要对符号感到惊讶。现在我想要3个特殊值，它们的x和y值已知是高亮显示的。现在用什么方式不重要了。一种可能是在位置上显示点，否则它们不显示。我的问题是我不知道如何控制一个特定的点。

var chart1 = new Highcharts.Chart({
chart: {
renderTo: 'chart-emg1',
type: 'line'
},
title: {
text: 'EMG 1'
},
xAxis: {
tickInterval: 1
},
yAxis: {
title: { text: 'Voltage'}
},
series: [{
data: [<%-data1 %>]
}]
});

Answer 1

您可以使用load事件并更新特定点。例如:

events: {
load: function() {
this.series[0].points.forEach(point => {
const isPointToHighlight = pointsToHighlight.some(
p => p.x === point.x && p.y === point.y
);
if (isPointToHighlight) {
point.update({
color: 'red',
marker: {
enabled: true
}
}, false);
}
});
this.redraw();
}
}

---

现场演示:http://jsfiddle.net/BlackLabel/tLd3j78f/

API参考:

https://api.highcharts.com/highcharts/chart.events.load

https://api.highcharts.com/class-reference/Highcharts.Point更新