3

私は Java/PHP プログラマーであり、Javascript を理解するのに不当な能力を持っているため、単純であるべき何かを扱う必要があります。

こちらのチャートをご覧ください: http://www.highcharts.com/stock/demo/compare

これは、すべて定義済みの 3 つのシリーズを示しています。私は自分のデータで同等の設定をしています。

私が実際に持っているのは 150 系列のデータであり、ユーザーがページを更新せずにどれを表示するかを選択できるようにしたいと考えています。何らかの方法で Chart.addSeries() を使用する必要があることはわかっています。ボタンのクリックからシリーズを追加するデモを見てきました: http://jsfiddle.net/gh/get/jquery/1.7.2/ highslide-software/highcharts.com/tree/master/samples/stock/members/chart-addseries/

問題は、このボタンが Web ページと JS の両方でハードコードされていることです。

<button id="button">Add series</button>

<script>
$('#button').click(function() {
    var chart = $('#container').highcharts();
    chart.addSeries({
        name: 'ADBE',
        data: ADBE
    });
    $(this).attr('disabled', true);
});
</script>

150 個のボタンは好きではありませんが、ボタンごとに固有の機能は必要ありません。誰かが私が共食いできる短い例を書き直すことができますか? 私のJSは本当に初歩的すぎます。

チェックボックスは問題ないかもしれませんが、実際にはあらゆる種類のトグルが機能します。シリーズをグラフから削除できますか (凡例をクリックする以外に)?

150シリーズのリストをチャート自体に結びつけるためのヒントを誰か教えてもらえますか?

各シリーズは JSON 経由で個別にロードする必要があります。

または、150 シリーズすべてをロードし、そのうちの 149 シリーズを無効にして、ユーザーが凡例自体を介して切り替えることができるようにする必要がありますか?

4

1 に答える 1

6

チェックボックスを使用してソリューションを作成しました。対象となるチェックボックスは、クラス「choice」を持つものです。「foreach」関数はすべてのチェックボックスを通過します。名前は現在の選択の「値」になり、データのコンテキストを提供しなかったため、データは現在手動で供給されています。あなたはそれで遊んで、それをあなたのために働かせることができます。

$('#button').click(function() {
    var buttons = $('.choice');
    var chart = $('#container').highcharts();

    buttons.each(function(){
        var choice = this.value;

        chart.addSeries({
            name: choice,
            data: ADBE
        });
    });
});
于 2013-05-10T12:43:16.127 に答える