0

API を使用して Google 縦棒グラフを描画しようとしています。データは Web サービスから JSON 文字列として取得され、解析してから操作してデータを追加し、グラフを表示します。

var jsond = JSON.parse(response.d);
                var data = null;

                data = new google.visualization.DataTable();
                for (var i = 0; i < jsond["cols"].length; i++) {
                    data.addColumn((jsond["cols"][i].type == 'number' ? 'number' : 'string'), null, jsond["cols"][i].id);
                }
                data.addRows(jsond["rows"].length);
                for (var i = 0; i < jsond["rows"].length; i++) {
                    data.setCell(i, 0, "'" + jsond["rows"][i].finmonth.toString() + "'");
                    data.setCell(i, 1, parseFloat(jsond["rows"][i].Target));
                    data.setCell(i, 2, parseFloat(jsond["rows"][i].Proposal));
                    data.setCell(i, 3, parseFloat(jsond["rows"][i].ContractTotal));
                    data.setCell(i, 4, parseFloat(jsond["rows"][i].Budget));
                    data.setCell(i, 5, parseFloat(jsond["rows"][i].flag));
                }

                var options = {
                    title: 'The road thus far',
                    vAxis: { title: "Totals" },
                    hAxis: { title: "Financial Month" }
                };

                var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
                chart.draw(data, options);

ここでの問題は、データを受け入れ、返されるエラーがないことです。データテーブルにロードされた後にデータを検査しましたが、data.toJSON()Googleがデータを規定する方法と一致しています。私のデータについては以下を参照してください。以下の例には1つのデータ行しか追加していないことに注意してください。12の標準行があります。

{"cols":[{"id":"finmonth","label":"","pattern":"","type":"string"},
{"id":"Target","label":"","pattern":"","type":"number"},
{"id":"Proposal","label":"","pattern":"","type":"number"},
{"id":"ContractTotal","label":"","pattern":"","type":"number"},
{"id":"Budget","label":"","pattern":"","type":"number"},
{"id":"flag","label":"","pattern":"","type":"number"}],
"rows":[{"c":[{"v":"'2013/1'","f":null},{"v":0,"f":null},{"v":37,"f":null},{"v":4696,"f":null},{"v":4733,"f":null},{"v":0,"f":null}]}],
"p":null}

それで、私は何が欠けていますか？テストデータをjavascript配列にハードコーディングすると、グラフが表示されるため... :/

4

1 に答える 1

0

私のコードには何も問題がないことがわかりました。グラフは jquery アコーディオン内にあり、これが問題の原因となっています。これを解決するには、アコーディオンがすでに「作成」された後にのみチャートをレンダリングします。

$('div').accordion();

呼ばれました。その後、正しくレンダリングする必要があります。

于 2013-10-16T11:37:09.073 に答える