8

ページの読み込み時と選択メニューの変更時に JQUERY AJAX 呼び出しで高いグラフを更新しようとしています。[[10,1228800000],[10,1228800000]] 形式で返されるデータがあります。グラフは空白で、どのデータもグラフ化されていません。

ここに投稿されたいくつかのソリューションを試しましたが、どれもうまくいきませんでした。

var chart;
        $(document).ready(function() {


            var options = {
                chart: {
                    renderTo: 'stats',
                    defaultSeriesType: 'spline'
                },
                title: {text:''},
                xAxis: {
                    type: 'datetime'
                },
                yAxis: {},
                series: []
            };
    var month = 'July';
    $.ajax({
        type: "POST",
        data: "month="+month,
        url: "update_visits_chart",
        success: function (data) {

            options.series.push(data);
            chart = new Highcharts.Chart(options);
        }
    });

エラーはありますか?前もって感謝します。編集:

最新のコードはまだ機能していません:

var options = {

            chart: {
                renderTo: 'stats',
                type: 'spline'
            },
            title: {
                text: ''
            },
            xAxis: {

                type:'datetime',
                tickInterval: 30 * 24 * 3600 * 1000,
                dateTimeLabelFormats: {
                    day: '%b %e'
                },
                labels: {
                    rotation: -45,
                    align: 'right'
                }
            },
            yAxis: {
                title: {
                    text: 'Number of visits'
                },
                min: 0
            },
            tooltip: {
                formatter: function() {
                        return Highcharts.dateFormat('%b %e', this.x) +'<br />'+this.y+' visit(s)';
                }
            },
            legend: {
                enabled: true
            },
            credits: {
                enabled: false
            },
            exporting: {
                enabled: false
            },
            series: [{
                name: 'Number of Visits',
                data: []
            }]
        };
        var month = 'July';
        $.ajax({
            type: "POST",
            url: "update_visits_chart",
            data: "month="+month,
            success: function(data){
                options.series[0].data = data;
                chart = new Highcharts.Chart(options);
            }
        });
4

2 に答える 2

8

ドキュメントで説明されているように、シリーズ オブジェクトの setData メソッドを使用する必要があります。あなたの場合はoptions.series[0].setData(Data)

そして、を使用して、Ajax の結果を文字列から実際のオブジェクト/配列に変換する必要があると思いますJSON.parse(data)

編集: @Ricardo Lohmann: ajax 呼び出しで、彼は応答で期待する dataType を指定しなかったため、jQuery は dataType を推測します。しかし、 as JSON で始まる文字列は認識されず、[彼の応答が正しい mime type で提供されるとは思えませんapplication/json。したがって、正しい MIME タイプを指定すると、問題も解決するはずです。しかし、質問者の完全な ajax 応答の例はありません。なので、私も推測です。

次の ajax 呼び出しをお勧めします。

$.ajax({
    type: "POST",
    url: "update_visits_chart",
    data: {month: month},
    dataType: 'json',
    success: function(data){
        options.series[0].setData(data);
    }
});

@ジュガル・タッカー

$.getJSON上記の ajax-call の単なるショートカットですが、オプションが少ないため柔軟性が低くなります。

于 2012-09-01T21:25:05.883 に答える
4

はすでに多次元配列であるdataため、シリーズに直接設定する必要があります。 次のコードで修正されます。変更data

options.series.push(data); options.series = data;

于 2012-09-01T01:37:00.247 に答える