php - 谷歌饼图 php mysql

Question

**

I used Google Pie chart using PHP MySQL. If I put my mouse on the chart it only shows 2 column data from the row. But there are three columns in that table & I want to show all the columns from the row. I have written this code to show 3rd column but it doesn't work.

**

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 饼图仅支持 2 列引用 Google Pie Chart

第一个是切片标签，第二个是切片值。

如果您想向图表添加更多信息，可以使用悬停时显示的工具提示。

有关列和角色的更多信息，请参阅 Column Roles

默认情况下，图表的工具提示中只会显示带有百分比的切片标签和切片值。

这可以通过传递以下格式的数据来定制

数据格式

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

如果您希望自定义工具提示的呈现，可以通过将 HTML 数据作为工具提示的内容来实现。

有关工具提示和自定义 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>