更新更改高图上的绘图线标签的颜色

Question

有没有办法在运动上升时更改绘图线标签的颜色，并在运动下降时以不同的字体颜色再次更改它？

yAxis.addPlotLine({
value: 66,
color: 'red',
width: 2,
id: 'plot-line-1',
label: {
text: 66,
align: 'right',
style: {
color: 'red',
fontWeight: 'bold'
},
y: newY,
x: 0
}
});

这是一个工作文件 http://jsfiddle.net/kttfv1h3/9/感谢您的帮助

Answer 1

您可以将 css 样式选项添加到您的 plotLabel 就像一个简单的对象; docs

var prev_val = 0; // global
plotlabel = yAxis.plotLinesAndBands[0].label;
if(prev_val <= y) {
plotlabel.css({'color':'blue'});    
} else {
plotlabel.css({'color':'green'});   
}
prev_val = y;

我的小提琴：http://jsfiddle.net/kttfv1h3/12/

Answer 2

在尝试了一下不同的设置后，我找到了一种方法来实现您所寻求的。

通过设计一个新的变量oldY并在setInterval中执行以下操作，标签颜色会根据值是增加还是减少而变化：

if(y < oldY) {
yAxis.plotLinesAndBands["0"].label.element.style.fill = 'red';
} else {
yAxis.plotLinesAndBands["0"].label.element.style.fill = 'green';
}
oldY = y;

请参阅 jsfiddle 以获取基于您提供的工作示例。