0

コードの$.getJSONセグメントが正常に機能し、「zippy」という変数を生成するという問題があります。コードのさらに下にある「series：data」の下の「zippy」にアクセスする必要があります。

残念ながら、私はそれを機能させることができない多くのことを試みました。最も簡単な方法は、funcation（zippy）呼び出しから「データを返す」$ .getJSON（jsonUrl、function（zippy）」ですが、そのデータを使用可能にする方法がわかりません。

$(function() {
    $(document).ready(function() {
        Highcharts.setOptions({
            global: {
                useUTC: false
            }
        });

        console.log("+++++++++++++++++++++++++++++++++++++");
        var jsonUrl = "http://www.someurl.com/thing.php?callback=?";

        $.getJSON(jsonUrl, function(zippy) {
            for(i = 0; i < zippy.cpmdata.length; i++) {
                console.log("TIMESTAMP: " + zippy.cpmdata[i].timestamp + " AFTER: ");


                zippy.cpmdata[i].timestamp = Date.parse(zippy.cpmdata[i].timestamp).getTime() / 1000;
                //var unixtime  Date.parse(temptime).getTime()/1000

                console.log(" TESST " + zippy.cpmdata[i].timestamp + " \r\n");

            }
        });
        console.log("+++++++++++++++++++++++++++++++++++++");

        var chart;
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                type: 'spline',
                marginRight: 10,
                events: {
                    load: function() {

                        // set up the updating of the chart each second
                        var series = this.series[0];
                        setInterval(function() {
                            var x = (new Date()).getTime(), // current time
                                y = Math.random();
                            series.addPoint([x, y], true, true);
                        }, 1000);
                    }
                }
            },
            series: [{
                name: 'Random data',
                data: (function() {
                    // generate an array of random data
                    var data = [],
                        time = (new Date()).getTime(),
                        i;

                    console.log("++NEED ACCESS HERE FOR ZIPPY++");
                    console.log(" =============== \r\n");
                    console.log(" FINAL " + zippy.cpmdata[5].timestamp + " \r\n");
                    return data;
                })()
            }]



        }
4

2 に答える 2

2

あなたの問題は、getJSONが非同期であるということです。あなたのコードで起こっていることはこれです：

  1. document.readyがトリガーされます
  2. getJSONが呼び出され、コールバック「function（zippy）」が登録されます。getJSONはコールバックを実行せずにすぐに戻ることに注意してください。

  3. HighChartsを使用してグラフを描画しようとしています

    ...数百ミリ秒後

  4. ブラウザはJSONリクエストを行います

    ...数百ミリ秒後

  5. JSONリクエストはデータを返し、「function（zippy）」へのコールバックをトリガーします

  6. 「function（zippy）」を実行します

ご覧のように。問題は、 「function（zippy）」がどのように実行されるかではなく、いつ実行されるかです。そのため、コールバック関数の外部でJSONリクエストの戻り値を使用したいコードを実行することはできません。（実際には可能ですが、setTimeoutを使用したポーリングや同期ajaxを使用したポーリングは今のところ無視します）

解決策は、後で実行するすべてのコードをコールバック関数内に移動することです。

$.getJSON(jsonUrl, function(zippy) {
        for(i = 0; i < zippy.cpmdata.length; i++) {
            console.log("TIMESTAMP: " + zippy.cpmdata[i].timestamp + " AFTER: ");


            zippy.cpmdata[i].timestamp = Date.parse(zippy.cpmdata[i].timestamp).getTime() / 1000;
            //var unixtime  Date.parse(temptime).getTime()/1000

            console.log(" TESST " + zippy.cpmdata[i].timestamp + " \r\n");

        }

        var chart;
        chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            type: 'spline',
            marginRight: 10,
            events: {
                load: function() {

                    // set up the updating of the chart each second
                    var series = this.series[0];
                    setInterval(function() {
                        var x = (new Date()).getTime(), // current time
                            y = Math.random();
                        series.addPoint([x, y], true, true);
                    }, 1000);
                }
            }
        },
        series: [{
            name: 'Random data',
            data: (function() {
                // generate an array of random data
                var data = [],
                    time = (new Date()).getTime(),
                    i;

                console.log(" FINAL " + zippy.cpmdata[5].timestamp + " \r\n");
                return data;
            })()
        }]
    });
于 2012-11-27T21:49:26.720 に答える
1

チャートを作成する前にjsonリクエストが完了するまで待つ必要があるため、すべてのnew Highcharts.Chart({...})ものをコールバック内に配置する必要があります。getJSONと言う私のコードコメントを参照してくださいCUT AND PASTE chart = new Highcharts.Chart({...}) STUFF HERE!!!。

$(document).ready(function() {
    Highcharts.setOptions({
        global: {
            useUTC: false
        }
    });

    console.log("+++++++++++++++++++++++++++++++++++++");
    var jsonUrl = "http://www.someurl.com/thing.php?callback=?";

    $.getJSON(jsonUrl, function(zippy) {
        for(i = 0; i < zippy.cpmdata.length; i++) {
            console.log("TIMESTAMP: " + zippy.cpmdata[i].timestamp + " AFTER: ");


            zippy.cpmdata[i].timestamp = Date.parse(zippy.cpmdata[i].timestamp).getTime() / 1000;
            //var unixtime  Date.parse(temptime).getTime()/1000

            console.log(" TESST " + zippy.cpmdata[i].timestamp + " \r\n");

            // CUT AND PASTE chart = new Highcharts.Chart({...}) STUFF HERE!!!

        }
    });
    console.log("+++++++++++++++++++++++++++++++++++++");

});
于 2012-11-27T21:45:43.793 に答える