Highcharts test tool
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container"></div>
CSS
#container {
min-width: 300px;
max-width: 800px;
height: 300px;
margin: 1em auto;
}
JavaScript
function toggle(series, visibility) {
var plotLine = series.yAxis.plotLinesAndBands.find(function (item) {
return item.id === series.options.plotLineId;
});
if (plotLine.label) {
plotLine.label.attr('visibility', visibility);
}
if (plotLine.svgElem) {
plotLine.svgElem.attr('visibility', visibility);
}
}
Highcharts.addEvent(Highcharts.Series, 'hide', function () {
toggle(this, 'hidden');
});
Highcharts.addEvent(Highcharts.Series, 'show', function () {
toggle(this, 'visible');
});
Highcharts.chart('container', {
xAxis: {
type: 'datetime'
},
yAxis: {
plotLines: [{
id: 'p0',
color: Highcharts.getOptions().colors[0],
value: 5,
width: 2,
dashStyle: 'dot',
label: {
text: 'Max'
}
}, {
id: 'p1',
color: Highcharts.getOptions().colors[1],
value: 7,
width: 2,
dashStyle: 'dot',
label: {
text: 'Max'
}
}]
},
plotOptions: {
series: {
pointStart: Date.UTC(2018, 0, 1),
pointIntervalUnit: 'day'
}
},
series: [{
data: [1, 4, 3, 5],
plotLineId: 'p0'
}, {
data: [7, 3, 4, 2],
plotLineId: 'p1'
}]
});