【问题标题】:Pie chart not showing slice饼图不显示切片
【发布时间】:2018-01-11 11:48:45
【问题描述】:

我使用谷歌服务创建了一个饼图。问题是我想在饼图中显示贷方和借方,但输出只有一种颜色。这是我的查询。

$data = mysqli_query($link, "select SUM(pay_payable) as debit, SUM(pay_paid) as credit from purchasers_payment where p_id = '$pur_id'");

这是我的图表设置。

var data = google.visualization.arrayToDataTable([
          ['Debit', 'Credit'],
          <?php
            while($row = mysqli_fetch_array($data))
            {
                echo "['".$row['debit']."',".$row['credit']."],";
            }
            ?>
        ]);

        var options = {
          is3D: true,
        };

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

这是我的代码输出 enter image description here

我想要这样的输出: enter image description here

【问题讨论】:

    标签: charts google-visualization


    【解决方案1】:

    PieChartdata format 为每个切片使用行
    要得到两个切片,你需要两行数据...

    ['Label', 'Value'],
    ['Debit', 10000],
    ['Credit', 2000]
    

    请参阅以下工作 sn-p...

    google.charts.load('current', {
        packages: ['corechart']
    }).then(function () {
      var data = google.visualization.arrayToDataTable([
        ['Label', 'Value'],
        ['Debit', 10000],
        ['Credit', 2000]
      ]);
    
      var options = {
        is3D: true,
        height: 300
      };
    
      var chart = new google.visualization.PieChart(document.getElementById('piechart'));
      chart.draw(data, options);
    });
    <script src="https://www.gstatic.com/charts/loader.js"></script>
    <div id="piechart"></div>

    试试下面的php...

    var data = google.visualization.arrayToDataTable([
      ['Label', 'Value'],
      <?php
        while($row = mysqli_fetch_array($data))
        {
            echo "['Debit',".$row['debit']."],['Credit',".$row['credit']."],";
        }
      ?>
    ]);
    

    【讨论】:

    • 先生,这绝对对我有帮助。非常感谢您的回复,这就是我想要的。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-08-09
    相关资源
    最近更新 更多