2017-09-18 10 views
0

GoogleチャートとPHP MySqlを使用して動的チャートを作成しようとしています。Google Charts PHP MySqlエラー

ここは私がやっていることです。

// 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(); 
} 

私はこのコードを実行すると、私は結果で取得:私はaverageAll()という関数を持っているDbOperationsコードで

<?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'; 
} 
?> 

私のPHPは、列の平均値を取得します次のような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を実行すると、私はクロームコンソールで次のエラーを取得する:

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> 

マイライン:19は、このコードです:

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

私はDataTableの「、両方のアプローチを試してみました"と" arrayToDataTable " 両方が機能しません。

誰かが私が間違っている可能性があることを知る手助けができますか?おかげさまで

答えて