2

積み上げパーセンテージ列を使用していくつかのデータをプロットしたいと思います。しかし、データは動的であり、データは ajax 経由で取得されます。

ajax 応答の 1 つの例を次に示します。

X 軸のカテゴリ -

Array
(
    [ID0] => 2013/07/22
    [ID1] => 2013/07/23
    [ID2] => 2013/07/24
    [ID3] => 2013/07/25
)

シリーズデータと名前-

Array
(
    [0] => Array
        (
            [ID1] => 5
            [ID3] => 2
            [ID4] => 1
            [ID5] => 4
        )

    [1] => Array
        (
            [ID1] => 5
            [ID3] => 1
            [ID4] => 2
        )

    [2] => Array
        (
            [ID1] => 5
            [ID2] => 1
            [ID3] => 2
            [ID4] => 3
            [ID5] => 4
        )

    [3] => Array
        (
            [ID1] => 6
            [ID2] => 3
            [ID4] => 1
            [ID5] => 1
        )

)

そして、これが私が欲しいものです - http://jsfiddle.net/NF9Yp/

4

1 に答える 1

0

サーバー側からカテゴリとシリーズ配列を生成できます。次に、次のように ajax 関数を実行します。jsondata はサーバーから Json 形式で返されます。jsondata のプロパティからオプションのカテゴリと系列の値を設定します。

        $.ajax({
        url: callbackUrl,            
        dataType: "json",
        async: true,
        cache: false,
        success: function (jsondata) {
var options = {
        chart: {
            type: 'column'
        },
        title: {
            text: 'Stacked column chart'
        },
        xAxis: {
            categories: jsondata.categories
        },
        yAxis: {
            min: 0,
            title: {
                text: 'Total fruit consumption'
            }
        },
        tooltip: {
            pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
            shared: true
        },
        plotOptions: {
            column: {
                stacking: 'percent'
            }
        },
            series: jsonData.series
    };
    $('#container').highcharts(options);
        },
        error: showAjaxError
    })
于 2013-07-29T11:21:50.980 に答える