рисовать Google диаграммы с JSON - PullRequest
Новая
       5

рисовать Google диаграммы с JSON

10 голосов
/ 15 августа 2011

Как я могу получить и использовать набор данных для диаграмм Google, если это был отдельный файл JSON ??Я пробовал jQuery getJSON, но не смог заставить его работать. Google Viz должен использовать JSON для рисования гистограммы. Есть ли собственный способ API Google?или я могу найти способ с помощью JQuery и как?Спасибо 

      // Load the Visualization API and the piechart package.
  google.load('visualization', '1.0', {'packages':['corechart']});

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

  // Callback that creates and populates a data table, 
  // instantiates the pie chart, passes in the data and
  // draws it.
  function drawChart() {

      // Create the data table.
      var data = new google.visualization.DataTable();
      data.addColumn('string', 'Products');
      data.addColumn('number', 'Automated');
      data.addRows([
        ['Product 1', 85],
        ['Product 2', 75],
        ['Product 3', 90], 
        ['Product 4', 40],
        ['Product 5', 40]
      ]);

      // Set chart options
      var pie_options = {'title':'How Much Automated our Products are?',
                     'width':520,'height':300
                    };
      var bar_options ={'width': 620, 'height': 300, 
                        'title': 'Products',
                        'hAxis': {'title': '% Automated', 'titleTextStyle': {'color': 'red', 'fontSize': 16}}
                      }
      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.PieChart(document.getElementById('piechart_div'));
      chart.draw(data, pie_options);

     var chart = new google.visualization.ColumnChart(document.getElementById('barchart_div'));
     chart.draw(data, bar_options);
}

1 Ответ

17 голосов
/ 15 августа 2011

new google.visualization.DataTable(json) работает.

Найдите правильную структуру для вывода dataTable.toJSON().

Итак, если у вас есть скрипт getjson.phpна вашем сервере, который возвращает правильно отформатированный json, вы можете сделать это: 

$.getJSON('/getjson.php', function(json) {
    var dataTable = new google.visualization.DataTable(json);
});
...