当前位置: 首页 > 面试题库 >

用JSON绘制Google图表

颜新
2023-03-14
问题内容

如果它是单独的JSON文件,如何检索和使用Google图表数据集?我尝试了jQuery getJSON,但无法正常工作。Google
Viz应该使用JSON绘制条形图有本地的Google API方法吗?还是可以找到一种使用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);
}

问题答案:

new google.visualization.DataTable(json) 作品。

查找的输出dataTable.toJSON()以使用正确的结构。

因此,如果服务器上有一个getjson.php脚本返回正确格式的json,则可以执行以下操作:

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


 类似资料:
  • 最新代码-http://jsfidle.net/ysqdh/88/- 这个版本使用gDouglasPeuker从绘制的版本中创建一个rudamentary多边形形状-http://jsfiddle.net/ysqdh/94/ ^这将禁用用于绘制的映射,并在创建形状后再次启用该映射。 我正在开发一个谷歌地图应用程序。而不是多边形点击练习。我想要能够画一个形状-然后转换成一个多边形。 下面是我的最新应

  • 问题内容: 我是Android开发的初学者,我正在上课。我的职责是将应用程序中的JSON数据显示为文本和图形。我正在使用Retrofit 2在一个活动中将其显示为文本,但是我在使用图形时遇到了问题,我不知道该怎么做(我仍在学习,到目前为止我所做的一切都是在帮助下来自教程)。 数据如下所示(这是一个示例): 我已经找到了,但是我不确定下一步该怎么做。我应该用数据制作两个数组列表(如果答案是,怎么做?

  • 问题内容: 当图表第一次使用初始默认Ajax答复加载时,它可以正常工作。如果我添加console.log(chart_data),我会看到默认数据,然后在提交后我会看到新数据。唯一的问题是图表不会再次绘制。我知道drawChart函数不会第二次运行,我只是不知道为什么。我假设是的话,图表将重绘。抱歉,答案很明显。我对jQuery / Ajax非常陌生。 任何帮助,将不胜感激。谢谢! 问题答案: 您

  • 问题内容: 我正在尝试使用Java的Graphics2D在屏幕上绘制图像。这是我正在使用的代码。我想看到图像在屏幕上稳定移动。目前,我可以看到图像,但是除非调整窗口大小,否则图像不会移动,在这种情况下,图像确实会移动。我已经勾勒出以下课程。 传递给Tester的Component对象是以下类: 我确保此类仅添加了一个精灵。Sprite类大致如下: 但是,我在屏幕上仅看到固定的Bowser图像。除非

  • 我正试着用Jupyter笔记本画热图。我的表由10个列和许多行组成。第一行是列名。我正在使用plotly lib。 dfs是数据帧。 而不是图形,我得到了很多这样的线条: '\n跟踪=判(\n x=x,y=y,z=z,\n类型="散射3d",\n模式=\'标记\',\n标记=判(大小=5,颜色=\'黑色\',线=判(宽度=0)))\n数据=[跟踪]\n\n\n etc 有什么问题?

  • 我正试图用PDFbox绘制饼图,但各片之间有白线,有人能帮我吗?是否有此选项? 附上我正在使用的绘制圆弧的代码: 结果的附加图像: 谢啦