簡體   English   中英

為什么我將ajax與Google GeoChart api一起使用失敗

[英]why I use ajax with Google GeoChart api failed

我是javascript新手。 而且我嘗試使用Google Geochart創建一個不錯的報告。 從示例中,代碼應如下所示:

function drawRegionsMap() {
        var data = google.visualization.arrayToDataTable([
          ['Country', 'Popularity'],
          ['Germany', 200],
          ['United States', 300],
          ['Brazil', 400],
          ['Canada', 500],
          ['France', 600],
          ['RU', 700]
        ]);

        var options = {};

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

就我而言,數據來自ajax請求。 所以我將代碼更改為:

function drawRegionsMap() {
var jsonData = $.ajax({
        url: "json/geo.pl",
        dataType: 'json',
        async: false
        }).responseText;

            var data = google.visualization.arrayToDataTable(jsonData);

            var options = {};

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

但這對我不起作用。 Firefox中的錯誤消息是“錯誤:不是數組”。 希望可以有人幫幫我。 謝謝!

json / geo.pl的輸出是:-bash-4.1 $ json / geo.pl

Content-Type: application/json; charset=ISO-8859-1

[
   [
      "Country",
      "Uploads"
   ],
   [
      "AL",
      1
   ],
   [
      "AP",
      1
   ],
   [
      "AR",
      47
   ],
   [
      "AT",
      25
   ],
   [
      "AU",
      75
   ],
   [
      "AZ",
      10
   ],
   [
      "BD",
      4
   ],
   [
      "BE",
      65
   ],
   [
      "BG",
      15
   ],
   [
      "BN",
      1
   ],
   [
      "BR",
      177
   ],
   [
      "CA",
      536
   ],
   [
      "CH",
      37
   ],
   [
      "CI",
      3
   ],
   [
      "CL",
      35
   ],
   [
      "CN",
      947
   ],
   [
      "CO",
      4
   ],
   [
      "CS",
      1
   ],
   [
      "CY",
      2
   ],
   [
      "CZ",
      20
   ],
   [
      "DE",
      135
   ],
   [
      "DK",
      51
   ],
   [
      "DO",
      1
   ],
   [
      "EE",
      26
   ],
   [
      "ES",
      53
   ],
   [
      "EU",
      2
   ],
   [
      "EU",
      9
   ],
   [
      "FI",
      19
   ],
   [
      "FR",
      183
   ],
   [
      "GB",
      341
   ],
   [
      "GE",
      14
   ],
   [
      "GR",
      11
   ],
   [
      "HK",
      94
   ],
   [
      "HR",
      2
   ],
   [
      "HU",
      7
   ],
   [
      "ID",
      37
   ],
   [
      "IE",
      36
   ],
   [
      "IL",
      122
   ],
   [
      "IN",
      543
   ],
   [
      "IS",
      5
   ],
   [
      "IT",
      129
   ],
   [
      "JP",
      200
   ],
   [
      "KG",
      4
   ],
   [
      "KR",
      451
   ],
   [
      "LB",
      3
   ],
   [
      "LK",
      1
   ],
   [
      "LT",
      5
   ],
   [
      "LU",
      4
   ],
   [
      "MA",
      2
   ],
   [
      "MD",
      3
   ],
   [
      "MO",
      3
   ],
   [
      "MU",
      2
   ],
   [
      "MX",
      77
   ],
   [
      "MY",
      43
   ],
   [
      "NG",
      1
   ],
   [
      "NI",
      1
   ],
   [
      "NL",
      33
   ],
   [
      "NO",
      27
   ],
   [
      "NZ",
      4
   ],
   [
      "OM",
      1
   ],
   [
      "PA",
      4
   ],
   [
      "PH",
      9
   ],
   [
      "PK",
      20
   ],
   [
      "PL",
      76
   ],
   [
      "PT",
      14
   ],
   [
      "PY",
      2
   ],
   [
      "QA",
      2
   ],
   [
      "RO",
      6
   ],
   [
      "RU",
      164
   ],
   [
      "SA",
      30
   ],
   [
      "SE",
      148
   ],
   [
      "SG",
      101
   ],
   [
      "SK",
      34
   ],
   [
      "TH",
      22
   ],
   [
      "TR",
      28
   ],
   [
      "TT",
      1
   ],
   [
      "TW",
      110
   ],
   [
      "UA",
      26
   ],
   [
      "US",
      9386
   ],
   [
      "VE",
      1
   ],
   [
      "VN",
      28
   ],
   [
      "ZA",
      89
   ],
   [
      "ZM",
      1
   ]
]

我已通過將json / array從ajax responseText轉換為javascript數組來解決此問題。

function drawRegionsMap() {
var jsonData = $.ajax({
        url: "json/geo.pl",
        dataType: 'json',
        async: false
        }).responseText;

var output = new Array();
output = JSON.Parse(jsonData);
            var data = google.visualization.arrayToDataTable(output);


            var options = {};

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

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM