Googleの円グラフのphp mysqlの

Question

**

私はPHPのMySQLを使用して、Google円グラフを使用。 チャートにマウスを置くと、行の2列のデータしか表示されません。しかし、そのテーブルには という3つの列があります。&行のすべての列を表示したいとします。私は このコードを書いて3番目の列を表示しても機能しません。

**

var data = google.visualization.arrayToDataTable([ 
      ['Problems', 'Sufferer', 'Solutions'], 

      <?php 

      while($row = $res->fetch_assoc()){ 
       echo "['".$row['Problems']."',".$row['sum(Sufferer)'].", '".$row['Solutions']."'],"; 
      } 

      ?> 

     ]); 

どのように私はこの問題を解決することができますか？ picture of my Pie Chart output example

Answer 1

グーグル円グラフのみGoogle Pie Chart

参照最初のスライスラベルであり、2番目のスライス値である2列を支持しています。

チャートに情報を追加する場合は、ホバーに表示されるツールチップを使用できます。列と役割の詳細について

、パーセンテージでのみスライスラベルとスライス値は、チャートのツールチップに表示されるデフォルトColumn Roles

参照。

これは、あなたがツールチップのレンダリングをカスタマイズしたい場合は、それのようにHTMLデータを渡すことによって達成することができ

var data = google.visualization.arrayToDataTable([ 
     ['Pizza', 'Popularity', {type:'string', role:'tooltip'}], 
     ['Pepperoni', 33, "Most popular"], 
    ]); 

形式以下

データ形式でデータを渡すことでカスタマイズすることができますツールチップの内容

ツールチップの詳細については

とHTMLコンテンツをカスタマイズするには、Tooltips

例

google.charts.load('current', {'packages':['corechart']}); 
 
google.charts.setOnLoadCallback(drawChart); 
 

 
function drawChart() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
    ['Pizza', 'Popularity', {type:'string', role:'tooltip'}], 
 
    ['Pepperoni', 33, "Most popular"], 
 
    ['Hawaiian', 26, "Popular"], 
 
    ['Mushroom', 22, "Somewhat popular"], 
 
    ['Sausage', 10, "Less popular"] 
 
    ]); 
 
    
 
    var options = { 
 
    title: 'Pizza Popularity' 
 
    }; 
 

 
    var chart = new google.visualization.PieChart(document.getElementById('piechart')); 
 

 
    chart.draw(data, options); 
 
}

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="piechart" style="width: 900px; height: 500px;"></div>