2

Google Charts Gaugeの値を動的に更新しようとしていますが、変数を値として使用しようとすると壊れます。

var data = google.visualization.arrayToDataTable([
    ['Label', 'Value'],
    //Doesn't work:
    ['Barometer', x],
    //Works:
    [x, 28],
    //Works:
    ['Barometer', 28]
    ]);

問題は、私が変数を宣言する方法です。なぜなら、私が使用するだけvar x=28で、それはうまく機能するからです。変数を取得するために使用しているコードは次のとおりです。Jqueryを使用してJSONファイルをフェッチし、ファイルから値を取得します。

var x
    $.getJSON('http://pipes.yahoo.com/pipes/pipe.run?_id=467a55b506ba06b9ca364b1403880b65&_render=json&textinput1=40.78158&textinput2=-73.96648&_callback=?',
        function(data){
            x = data.value.items[0].data[1].parameters.pressure.value;
        }
    )

を使ってみx = eval(x)ましたが、まったくうまくいきませんでした。しかし、x = eval(x+1-1)またはを使用するx = x+1-1と、ゲージが表示されましたが、値はNaNでした。

4

1 に答える 1

2

わかりました、解決しました。

Google Charts API をロードする前に変数を定義することになり、変数を定義する直前に を追加しましx = eval(x)た。

したがって、最終的な単純化されたコードは次のとおりです。

var x
$.getJSON('insert JSON url here WITH QUOTES',
    function(data){
        x = path.to.something.in.JSON.file.here;
    }

google.load('visualization', '1', {
    packages: ['gauge']
});
google.setOnLoadCallback(drawChart);

function drawChart() {

    x = eval(x)
    var Data = google.visualization.arrayToDataTable([
        ['Label', 'Value'],
        ['Gauge', x],
        ]);

    var Options = {
    };

    var Chart = new google.visualization.Gauge(document.getElementById('insertGaugeContainerHere'));
    Chart.draw(Data, Options);
}

ご参考までに、最終製品はこちらにあります。

于 2012-05-28T16:47:30.723 に答える