如何使用JSON将数组从PHP传递到javascript来制作Google Chart？

问题描述：

I want to make a Google Chart and I am trying to send a JSON encoded array from a PHP script to a JavaScript. The two files are as follows:

<html>

<head><title>

</title></head>

<body>
<?php
$data[0]=array('State','Values');
$data[1]=array('Correct',6);
$data[2]=array('Incorrect',3);

echo json_encode($data);
?>
</body>
</html>

This is saved as test.php

The javascript file is:

 <html>
   <head>
     <script type="text/javascript" src="jquery-1.9.1.min.js"></script>
     <script type="text/javascript" src="https://www.google.com/jsapi"></script>
     <script type="text/javascript">
       google.load("visualization", "1", {packages:["corechart"]});
       google.setOnLoadCallback(drawChart);

       function drawChart() {


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

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

    var options = {
      title: 'My Chart'
    };

    var chart = new oogle.visualization.PieChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
     </script>
   </head>

   <body>
     <div id="chart_div" style="width: 900px; height: 500px;"></div>
   </body>

 </html>

This is saved as test2.php.

When I run test2.php, nothing happens and the browser shows a blank screen. Where am I going wrong here? Please help.

Thanks.

我想创建一个Google Chart我试图将一个JSON编码的数组从PHP脚本发送到JavaScript 。这两个文件如下： p>

 ＆lt; html＆gt; 
 
＆lt; head＆gt;＆lt; title＆gt; 
 
＆lt; / title＆gt;＆lt; / head＆gt; \  ñ
＆LT;主体＆GT; 
＆LT; PHP中
 $的数据[0] =阵列（ '州'， '值'）; 
 $的数据[1] =阵列（ '正确'，6）; 
 $的 data [2] = array（'Incorrect'，3）; 
 
echo json_encode（$ data）; 
？＆gt; 
＆lt; / body＆gt; 
＆lt; / html＆gt; 
  code>  pre  > 
 
 保存为test.php  p> 
 
 
 javascript文件为： p> 
 
 
 ＆lt; html＆gt; \  n＆lt; head＆gt; 
＆lt; script type =“text / javascript”src =“jquery-1.9.1.min.js”＆gt;＆lt; / script＆gt; 
＆lt; script type =“text / javascript”src  =“https://www.google.com/jsapi”＆gt;＆lt; / script＆gt; 
＆lt; script type =“text / javascript”＆gt; 
 google.load（“visualization”，“1”，{ 包：[“corechart”]}）; 
 google.setOnLoadCallback（drawChart）; 
 
函数drawChart（）{
 
 
 var jsonData = $ .ajax（{
 url：“test.php  “，
 dataType：”json“，
 async：false 
}）。responseText; 
 
 var data = google.visualization.arrayToD  ataTable（jsonData）; 
 
 var options = {
 title：'My Chart'
}; 
 
 var chart = new oogle.visualization.PieChart（document.getElementById（'chart_div'））; \  n chart.draw（数据，选项）; 
} 
＆lt; / script＆gt; 
＆lt; / head＆gt; 
 
＆lt; body＆gt; 
＆lt; div id =“chart_div”style =“width：  900px; 高度：500px;“＆gt;＆lt; / div＆gt; 
＆lt; / body＆gt; 
 
＆lt; / html＆gt; 
  code>  pre> 
 
 这保存为test2  .php。 p> 
 
 
当我运行test2.php时，没有任何反应，浏览器显示一个空白屏幕。我在哪里错了？请帮忙。 p> 
 
 谢谢。 p> 
  div>

答

You don't need any HTML tags in your test.php. Instead, just use:

<?php
$data[0]=array('State','Values');
$data[1]=array('Correct',6);
$data[2]=array('Incorrect',3);

header("Content-Type: application/json");
echo json_encode($data);
?>

HTML is not a part of JSON.

答

test.php does not need all those html tags, just return the json. When mixing js and PHP it is sometimes a good idea to just use hardcoded values first, then have PHP create those hardcoded values when you are sure your js is joined up and working.

如何使用JSON将数组从PHP传递到javascript来制作Google Chart？

相关推荐