0
我只是使用renderer.label和plotline animate（Add design to plotLabel Highcharts）檢查了一個關於使用設計製作標籤的帖子。我的問題是，有沒有辦法使用chart.renderer.path作爲移動的水平網格線而不是使用公共劇情圖？我對如何使用renderer.path有點困惑。你能幫我嗎？非常感謝您對此的幫助。將chart.renderer.path製作爲情節線Highcharts
const plotband = yAxis.addPlotLine({
value: 66,
color: 'red',
width: 2,
id: 'plot-line-1',
/* label: {
text: 66,
align: 'right',
y: newY,
x: 0
}*/
});
const labelOffset = 15
const plotbandLabel = this.renderer.label((66).toFixed(2), chart.plotLeft + chart.plotWidth - 8, yAxis.toPixels(66) - labelOffset, 'rect').css({
color: '#FFFFFF'
}).attr({
align: 'right',
zIndex: 99,
fill: 'rgba(0, 0, 0, 0.75)',
padding: 8
})
.add()
setInterval(function() {
var x = (new Date()).getTime(), // current time
y = Math.round(Math.random() * 100);
series.addPoint([x, y], true, true);
plotLine = yAxis.plotLinesAndBands[0].svgElem;
d = plotLine.d.split(' ');
newY = yAxis.toPixels(y) - d[2];
plotlabel = yAxis.plotLinesAndBands[0].label;
plotbandLabel.animate({
y: yAxis.toPixels(y) - labelOffset
}, {
duration: 400,
step: function() {
this.attr({
text: yAxis.toValue(this.y + labelOffset).toFixed(2)
})
},
complete: function() {
this.attr({
text: y.toFixed(2)
})
}
}),
plotLine.animate({
translateY: newY
}, 400);
請看這jsfiddle我從以前的帖子中得到。 http://jsfiddle.net/x8vhp0gr/ 非常感謝你