最近Highchartsをちょこちょこいじっているので、仕入れたのを小出しにしていきます。
Highchartsでは凡例を出しておくと凡例のクリックでデータ毎に表示の切り替えができます。
ですが、凡例は見た目上の工夫がほぼできないため、凝ったUIで表示状態を切り替えるためにはJavascriptを書いて制御してあげる必要があります。
seriesにはhide()やshow()という関数、visibleという属性があるのでそれらを駆使してJavscriptから制御が可能です。
以下、ボタンを押したらvisibleで状態を見て、隠すなり出すなりするコードです。
1function onClick() {
2 var series = chart.series[0];
3 if (series.visible) {
4 series.hide();
5 } else {
6 series.show();
7 }
8}
全体はこちら。
案外簡単なので自前のUIというもの簡単に実現できそうです。