MysqlデータベースのGoogle棒グラフ

私は3つのフィールド領域（vachar）、new_customers（int）、old_customers（int）を持つmysqlデータベースを持っています。MysqlデータベースのGoogle棒グラフ

私はGoogleグラフとPHPで棒グラフを作成しようとしていますが、動作しません。私はエコーでsthを間違ってやっていると思う。は、ここに私のコードです：

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 

<script type="text/javascript"> 
google.load('visualization', '1', {packages: ['corechart', 'bar']}); 
google.setOnLoadCallback(drawMaterial); 

function drawMaterial() { 
var data = google.visualization.arrayToDataTable([ 
['Region', 'New Customers', 'Old Customers'], 
<?php 
$query = "SELECT sum(new_customers) AS new, sum(old_customers) AS old, region FROM daily GROUP BY region"; 

$exec = mysqli_query($con,$query); 

while($row = mysqli_fetch_array($exec)){ 

echo "['".$row['region']."',"; 

echo "['".$row['new']."',"; 

echo "['".$row['old']."',"; 

} 
?> 
]); 

var options = { 

title: 'Country wise new and returned visitors', 

bars: 'horizontal' 
}; 
var material = new google.charts.Bar(document.getElementById('barchart')); 
material.draw(data, options); 
} 
</script>

出典

2017-03-21 P. Tzik

クエリを実行した後に値がありますか？ –

Yeapクエリが正常に動作する新しい古い領域、8 6アメリカ、2 4アジア、127 67ヨーロッパ –

drawMaterial関数の外部でクエリを実行し、必要な構造に従ってデータをフォーマットしてから、 drawMaterial関数です。あなたの機能に何か問題があるようです。 –

チャートはデータ変数に3つのパラメータを取っていないことをあなたが持っている問題があります。現時点ではあなたはそれが好きです：['Region', 'New Customers', 'Old Customers'],。

['Region', 'New Customers']、に変更してください。

while loopでは、PHPは$row['new']または$row['old']という名前の列を認識しません。代わりに、インデックスを使用してにあなたのエコーを変更します。 echo "['".$row[2]." [".$row[0]."]', ".$row[1]."],「;

私はまた、関数の外でSQLクエリを持っていることをお勧めしますし、SQL結果（echoとwhile loop）を介してのみの繰り返しを持っているでしょう

。

また、あなたはあなたが単語「チャート」を追加するのを忘れて、適切にチャートをロードしませんでした：。

google.charts.load('visualization', '1', {packages: ['corechart', 'bar']}); 
    google.charts.setOnLoadCallback(drawMaterial);

これが最終的なソリューションです：

<?php 
include("YOUR PHP CONNECT FILE"); 

$query = "SELECT sum(new_customers) AS new, sum(old_customers) AS old, region FROM daily GROUP BY region"; 
$exec = mysqli_query($YOURCONNECTIONVARIABLE ,$query); 

?> 

<!DOCTYPE html> 
    <head> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script type="text/javascript"> 
     google.charts.load('visualization', '1', {packages: ['corechart', 'bar']}); 
     google.charts.setOnLoadCallback(drawMaterial); 

     function drawMaterial() { 
     var data = google.visualization.arrayToDataTable([ 
     ['Region', 'New Customers'], 
     <?php 
      while($row = mysqli_fetch_array($exec)){ 
      echo "['".$row[2]." [".$row[0]."]', ".$row[1]."],"; 
      } 
     ?> 
     ]); 

     var options = { 
      title: 'Country wise new and returned visitors', 
      bars: 'horizontal' 
     }; 

     var material = new google.charts.Bar(document.getElementById('barchart')); 
      material.draw(data, options); 
     } 
    </script> 
</head> 
<body> 
    <div id="barchart" style="width: 100%; height: 40em;"></div> 
</body> 
</html>

ご不明な点がありましたら教えてください。

出典

2017-03-31 01:08:36 CVtech

MysqlデータベースのGoogle棒グラフ

答えて

関連する問題