Google 图表 PHP MySql 错误
Google Charts PHP MySql error
我正在尝试使用 Google 图表和 PHP MySql 创建动态图表。
这就是我正在做的事情。
我的 PHP 获取列的平均值:
<?php
$response = array();
require_once dirname(__FILE__) . '/../includes/DbOperation.php';
// opening db connection
$db = new DbOperation();
if($db->averageAll()){
$response['error']=false;
$response['message']='Team added successfully';
}else{
$response['error']=true;
$response['message']='Could not add team';
}
?>
在 DbOperations 代码中,我有一个名为 averageAll() 的函数:
// My PHP Function
public function averageAll(){
$query = "SELECT AVG(concept1) AS c1, AVG(concept2) AS c2, AVG(concept3) AS c3, AVG(concept4) AS c4, AVG(concept5) AS c5, AVG(concept6) AS c6 FROM KeyPad";
if ($stmt = $this->conn->prepare($query)) {
$alldata = array();
$stmt->execute();
$stmt->bind_result($c1, $c2, $c3, $c4, $c5, $c6);
while ($stmt->fetch()) {
$tempArr = array();
array_push($tempArr, array("label" => "Concept", "type" =>"String"));
array_push($tempArr, array("label" => "Time", "type" =>"number"));
array_push($alldata, $tempArr);
array_push($alldata, array("C1", $c1));
}
echo json_encode($alldata, JSON_NUMERIC_CHECK);
$stmt->close();
}
$this->conn->close();
}
当我 运行 这段代码时,我得到以下 json 格式的结果:
[
[
{label: "Concept",type: "String"},
{label: "Time", type: "number"}
],
["C1", 2.8890909090909],
["C2", 1.28376],
]
现在我的图表 HTML 看起来像这样:
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
//alert(result);
var jsonData = $.ajax({
url: "http://www.ssdesigninteractive.com/keypad/api/readaverage.php",
dataType: "json",
async: false
}).responseText;
var data = google.visualization.DataTable(jsonData);
var options = {
title: 'Company Performance',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>
当我 运行 html 时,我在 Chrome 控制台中收到以下错误:
Uncaught (in promise) Error: Not an array
at gvjs_Fba (jsapi_compiled_default_module.js:84)
at new gvjs_8m (jsapi_compiled_default_module.js:86)
at drawChart (gChart.html:19)
at <anonymous>
我的line:19是这个代码:
var data = google.visualization.DataTable(jsonData);
我尝试了两种方法,"DataTable" 以及 "arrayToDataTable"
两个都不行。
有人可以帮我找出我可能做错了什么吗?
谢谢。
您检索 responseText
的语法似乎有误。参见 how do I get the reponse text from ajax / jquery?
我正在尝试使用 Google 图表和 PHP MySql 创建动态图表。
这就是我正在做的事情。
我的 PHP 获取列的平均值:
<?php
$response = array();
require_once dirname(__FILE__) . '/../includes/DbOperation.php';
// opening db connection
$db = new DbOperation();
if($db->averageAll()){
$response['error']=false;
$response['message']='Team added successfully';
}else{
$response['error']=true;
$response['message']='Could not add team';
}
?>
在 DbOperations 代码中,我有一个名为 averageAll() 的函数:
// My PHP Function
public function averageAll(){
$query = "SELECT AVG(concept1) AS c1, AVG(concept2) AS c2, AVG(concept3) AS c3, AVG(concept4) AS c4, AVG(concept5) AS c5, AVG(concept6) AS c6 FROM KeyPad";
if ($stmt = $this->conn->prepare($query)) {
$alldata = array();
$stmt->execute();
$stmt->bind_result($c1, $c2, $c3, $c4, $c5, $c6);
while ($stmt->fetch()) {
$tempArr = array();
array_push($tempArr, array("label" => "Concept", "type" =>"String"));
array_push($tempArr, array("label" => "Time", "type" =>"number"));
array_push($alldata, $tempArr);
array_push($alldata, array("C1", $c1));
}
echo json_encode($alldata, JSON_NUMERIC_CHECK);
$stmt->close();
}
$this->conn->close();
}
当我 运行 这段代码时,我得到以下 json 格式的结果:
[
[
{label: "Concept",type: "String"},
{label: "Time", type: "number"}
],
["C1", 2.8890909090909],
["C2", 1.28376],
]
现在我的图表 HTML 看起来像这样:
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
//alert(result);
var jsonData = $.ajax({
url: "http://www.ssdesigninteractive.com/keypad/api/readaverage.php",
dataType: "json",
async: false
}).responseText;
var data = google.visualization.DataTable(jsonData);
var options = {
title: 'Company Performance',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>
当我 运行 html 时,我在 Chrome 控制台中收到以下错误:
Uncaught (in promise) Error: Not an array
at gvjs_Fba (jsapi_compiled_default_module.js:84)
at new gvjs_8m (jsapi_compiled_default_module.js:86)
at drawChart (gChart.html:19)
at <anonymous>
我的line:19是这个代码:
var data = google.visualization.DataTable(jsonData);
我尝试了两种方法,"DataTable" 以及 "arrayToDataTable" 两个都不行。
有人可以帮我找出我可能做错了什么吗? 谢谢。
您检索 responseText
的语法似乎有误。参见 how do I get the reponse text from ajax / jquery?