Axis.update メソッドを使用して yAxis を動的に更新する際に問題があります。yAxis で更新を行うときに、複数のプロット バンドがある場合、yAxis が再描画されたときに 2 番目のプロット バンドが削除されないため、複製されます。これはおそらく Highcharts (highstock) ライブラリの問題だと思いますが、誰かがこれを経験したことがあり、設定を見逃したかどうかを知っているかどうか疑問に思っていました.
HTML:
<div id="chart"></div>
<button id="autoscale">Toggle autoscale</button>
JavaScript:
$("#chart").highcharts({
height: 350,
yAxis: [{
top: 50,
height: 200,
min: 0,
max: 30,
tickInterval: 4,
plotBands: [{
from: 12,
to: 16,
color: "#d9edf7",
label: {
"text": "Plot band 1"
}
}, {
from: 20,
to: 25,
color: "#dff0d8",
label: {
text: "Plot band 2"
}
}]
}],
series: [{
type: "line",
yAxis: 0,
data: [1, 5, 9, 15, 19, 21, 26, 9]
}]
});
$("#autoscale").on("click", function () {
$(this).toggleClass("autoscaled");
var autoscaled = $(this).hasClass("autoscaled");
var chart = $("#chart").highcharts();
chart.yAxis[0].update({
min: autoscaled ? null : 0,
max: autoscaled ? null : 30,
tickInterval: autoscaled ? null : 4
});
});
アップデート
これは、すべての偶数番号のプロット バンドに問題があるようです! http://jsfiddle.net/StgHu/1/