Highchartsのseriesの表示非表示をJSで切り替える
最近Highchartsをちょこちょこいじっているので、仕入れたのを小出しにしていきます。 Highchartsでは凡例を出しておくと凡例のクリックでデータ毎に表示の切り替えができます。 ですが、凡例は見た目上の工夫がほぼできないため、凝ったUIで表示状態を切り替えるためにはJavascriptを書いて制御してあげる必要があります。
最近Highchartsをちょこちょこいじっているので、仕入れたのを小出しにしていきます。 Highchartsでは凡例を出しておくと凡例のクリックでデータ毎に表示の切り替えができます。 ですが、凡例は見た目上の工夫がほぼできないため、凝ったUIで表示状態を切り替えるためにはJavascriptを書いて制御してあげる必要があります。
今日もHighcharts。今度は新しいデータ列を追加する方法です。 https://jsfiddle.net/rveczxL1/7 昨日のJSFiddleをちょっと改変して、ボタンを押したら新しいデータ列を追加します。データの変更のときと同様アニメーションつきで描画されるのでとてもリッチな感じで良いです。
Highchartsで描画したチャートの値はあとからjavascriptで更新できます。 デモをちょっと改変してサンプルを作ってみました↓ https://jsfiddle.net/sz84x5q6/8/ options = {} // 略 var chart = Highcharts.chart('container', options); function onClick() …