2

我在 Google 可视化中制作了一个地理地图,它可以与 JavaScript 一起正常工作,但我需要能够即时更新,因此需要以 JSON 格式创建数据。

这是我想在 JSON 中复制的 js:

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

我已经阅读了大约 10 次文档,但我不明白如何将上述内容构建为 Google 的示例格式:

{
  "cols": [
        {"id":"","label":"Topping","pattern":"","type":"string"},
        {"id":"","label":"Slices","pattern":"","type":"number"}
      ],
  "rows": [
        {"c":[{"v":"Mushrooms","f":null},{"v":3,"f":null}]},
        {"c":[{"v":"Onions","f":null},{"v":1,"f":null}]},
        {"c":[{"v":"Olives","f":null},{"v":1,"f":null}]},
        {"c":[{"v":"Zucchini","f":null},{"v":1,"f":null}]},
        {"c":[{"v":"Pepperoni","f":null},{"v":2,"f":null}]}
      ]
}

我不知道“c”、“v”、“f”和“pattern”是什么,所以不明白如何为地理地图创建它。如果有人有任何想法,我将不胜感激!!

4

2 回答 2

3

我尽力解释它。

{
  // The 'cols' array contains all the columns of your chart.
  "cols": [
        { // This object describes the first column.
          // The first column has an empty string for its id, the label 'Topping',
          // and the type 'string'. The 'pattern' is optional.
          "id": "",
          "label": "Topping",
          "pattern": "",
          "type": "string"},
        {"id":"","label":"Slices","pattern":"","type":"number"}
      ],
  // The 'rows' array contains all the rows of your chart.
  "rows": [
        // Each row object must have a 'c' property, which is an array of cells
        // Each cell has a 'v' value and an 'f' value.
        // The 'v' value contains the actual value of the cell.
        // The 'f' value contains the formatted value of the cell.
        {"c":[{"v":"Mushrooms","f":null},{"v":3,"f":null}]},
        {"c":[{"v":"Onions","f":null},{"v":1,"f":null}]},
        {"c":[{"v":"Olives","f":null},{"v":1,"f":null}]},
        {"c":[{"v":"Zucchini","f":null},{"v":1,"f":null}]},
        {"c":[{"v":"Pepperoni","f":null},{"v":2,"f":null}]}
      ]
}
于 2013-07-01T15:10:17.823 回答
0
// Load the Visualization API and the piechart package.
google.load('visualization', '1', {'packages':['corechart']});

// Set a callback to run when the Google Visualization API is loaded.
google.setOnLoadCallback(drawChart);

function drawChart() {
  var jsonData = $.ajax({ 
      url: "getData.php",
      dataType:"json",
      async: false
      }).responseText;

  // Create our data table out of JSON data loaded from server.
  var data = new google.visualization.DataTable(jsonData);

  // Instantiate and draw our chart, passing in some options.
  var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
  chart.draw(data, {width: 400, height: 240});
}

谷歌在这里有一个指南:点击这个链接了解详情

于 2015-08-25T19:32:26.110 回答