Javascript 使用JSON/JS通过AJAX调用创建Google图表
CI在创建图表时遇到问题。我已经阅读了很多教程，基本上是根据它们编写代码的。然而，问题是图表根本不会显示。 我希望通过AJAX调用从SQLite3中检索数据，然后基于该数据绘制图表。 可以是柱状图或饼图，没关系。 我很确定我处理JSON的方式存在一些问题，我希望有人能帮助我。谢谢Javascript 使用JSON/JS通过AJAX调用创建Google图表,javascript,jquery,ajax,json,google-visualization,Javascript,Jquery,Ajax,Json,Google Visualization,CI在创建图表时遇到问题。我已经阅读了很多教程，基本上是根据它们编写代码的。然而，问题是图表根本不会显示。 我希望通过AJAX调用从SQLite3中检索数据，然后基于该数据绘制图表。 可以是柱状图或饼图，没关系。 我很确定我处理JSON的方式存在一些问题，我希望有人能帮助我。谢谢 #test.html -------------------------------------------------------------------------
#test.html
-------------------------------------------------------------------------
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
function drawChart() {
var jsonData = $.ajax({
url: "test-return.php",
dataType: "json",
async: false
}).responseText;
document.getElementById('rightDiv').innerHTML = jsonData;
var jsonData2 = [["FC Internazionale ",24],["AS Roma ",24],["Milan AC ",20],["UC Sampdoria ",19],["US Citt\u00e0 di Palermo",18],["SSC Napoli ",15],["Juventus FC ",16],["Parma FC ",14],["Genoa CFC ",14],["AS Bari ",13],["AC Fiorentina ",13],["SS Lazio ",11],["Calcio Catania ",10],["Cagliari Calcio ",11],["Udinese Calcio ",11],["AC Chievo Verona ",12],["Bologna FC ",10],["Atalanta BC ",9],["AC Siena ",7],["AS Livorno Calcio ",7]];
var data = google.visualization.arrayToDataTable(jsonData2,true);
var options = {
title: 'table 1'
};
var chart = new google.visualization.ColumnChart(
document.getElementById('chart_div'));
chart.draw(data, options);
}
google.load('visualization', '1', {packages:['corechart'], callback: drawChart});
</script>
</head>
<body>
<div id="chart_div" style="width: 400px; height: 500px;"></div>
<div id="rightDiv">query results</div>
</body>
</html>
#test-return.php
-----------------------------------------------------------------------------
<?php
sqlite code here
................
echo json_encode($row_array);
?>
$row_array output => [["FC Internazionale ",24],["AS Roma ",24],["Milan AC ",20],["UC Sampdoria ",19]......
#test.html
-------------------------------------------------------------------------
函数绘图图（）{
var jsonData=$.ajax({
url:“test return.php”，
数据类型：“json”，
异步：false
}).responseText；
document.getElementById（'rightDiv'）。innerHTML=jsonData；
var jsonData2=[“国际米兰俱乐部”，24]，“作为罗马俱乐部”，24]，“米兰AC俱乐部”，20]，“坎普多利亚大学”，19]，“美国城市巴勒莫”，18]，“南卡那不勒斯俱乐部”，15]，“尤文图斯俱乐部”，16]，“帕尔玛俱乐部”，14]，“热那亚CFC俱乐部”，14]，“作为巴里俱乐部”，13]，“AC佛罗伦萨俱乐部”，13]，“SS拉齐奥俱乐部”，11]，“卡塔尼亚俱乐部”，10]，“卡利亚里俱乐部”，11]，“乌迪内斯俱乐部”，11]，“AC切沃维罗纳俱乐部”12]，“博洛尼亚足球俱乐部”，10]，“亚特兰大BC”，9]，“AC锡耶纳”，7]，“作为利沃诺足球俱乐部”，7]；
var data=google.visualization.arrayToDataTable（jsonData2，true）；
变量选项={
标题：“表1”
};
var chart=新的google.visualization.ColumnChart(
document.getElementById（'chart_div'）；
图表绘制（数据、选项）；
}
load（'visualization'，'1'，{packages:['corechart']，callback:drawChart}）；
查询结果
#test-return.php
-----------------------------------------------------------------------------
$row_阵列输出=>[[“国际足球俱乐部”，24]，“罗马队”，24]，“米兰AC队”，20]，“坎普多利亚大学”，19]。。。。。。
arrayToDataTablearrayToDataTabletruejsonData=$.ajax（…）.responseText；jsonDataarrayToDataTableJSON.parsevar data = google.visualization.arrayToDataTable(JSON.parse(jsonData), true);
您好！感谢您与我分享这些宝贵的信息。我当然已经对服务器端代码进行了必要的调整，以删除这些不必要的数字（1、2、3…）.Ialso按照您的建议添加了布尔true，但由于某些原因它仍然无法工作。有什么想法吗？我非常感谢您的帮助！使用您提供的代码和JSON字符串，我能够绘制图表：。在Chrome中打开页面，并检查开发人员的控制台（在Windows版本中打开ctrl+shift+j）。是否报告了任何错误？如果没有，请导航到浏览器中的
test return.phparrayToDataTableJSON.parse