简体   繁体   English

使用带有SQL的谷歌图表API

[英]using google chart api with sql

so i'm trying to use sql statements in google charts api, but i'm not sure how to do this... i know we arent supposed to use javascript for sql (although it is possible) si was wondering how in the world i'm supposed to use my data in my database for the chart. 所以我想在Google Charts api中使用sql语句,但是我不确定该怎么做...我知道我们不应该为Java使用javascript(尽管有可能)si想知道世界上如何我应该将数据库中的数据用于图表。 i already came up with the php statements which the elements are already ready in a array for google charts api to read, but the example i'm seeing i'm not sure if i could just pass it in like any other javascript function, heres my example... 我已经想出了php语句,其中的元素已经准备好在数组中供Google Charts api读取,但是我看到的示例是我不确定是否可以像其他任何javascript函数一样将其传递给我我的例子

  <html>
  <head>
      <!--Load the AJAX API-->
      <script type="text/javascript" src="https://www.google.com/jsapi"></script>
      <script type="text/javascript">

      // 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', 'Topping');
      data.addColumn('number', 'Slices');
      data.addRows([
        ['Mushrooms', 3],
        ['Onions', 1],
        ['Olives', 1], 
        ['Zucchini', 1],
        ['Pepperoni', 2]
      ]);

      // Set chart options
      var options = {'title':'How Much Pizza I Ate Last Night',
                     'width':400,
                     'height':300};

      // Instantiate and draw our chart, passing in some options.
      var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
      chart.draw(data, options);
    }
    </script>
  </head>

  <body>
    <!--Div that will hold the pie chart-->
    <div id="chart_div"></div>
  </body>
</html>

if i have an array from my php code, how do i end up sending it to drawchart when .setonloadcallback(drawchart) takes no parameters? 如果我的php代码中有数组,当.setonloadcallback(drawchart)不带任何参数时,如何最终将其发送到drawchart? i already tried putting parameters in there and it would just break the whole segment of code (chart would just not show up) any thoughts would be helpful! 我已经尝试过在其中放置参数,它将破坏整个代码段(图表将不会显示),任何想法都将有所帮助!

You should transfer the data from the backend (PHP/MySQL) to the frontend (Javascript). 您应该将数据从后端(PHP / MySQL)传输到前端(Javascript)。

  1. If you don't need to do it asynchronously , you can just copy them among the Javascript code and use the array in Google Chart Api's request. 如果您不需要异步执行此操作 ,则只需在Javascript代码之间复制它们,然后在Google Chart Api的请求中使用该数组即可。 Beware, you should respect the Javascript syntax while copying the code and that is certainly your problem here. 当心,在复制代码时应该尊重Javascript语法,这当然是您的问题。 Synchronously here means that the chart won't change unless you reload the page. 在此同步表示除非重新加载页面,否则图表不会更改。

  2. If you need to do it asynchronously to use Ajax: 如果需要异步使用Ajax,请执行以下操作:

    • From the Javascript you call asynchronously the PHP script on the backend that retrieve some data from the database 从Javascript中,您异步调用后端的PHP脚本,该脚本从数据库中检索一些数据

    • You get the data back from that PHP script and then send them to the Google Chart Api 您可以从该PHP脚本中获取数据,然后将其发送到Google Chart Api

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM