即使值为零，条形图也会出现 - Google 图表

Question

我使用 Google 图表创建了月度图表，但即使值为零，条形图也会显示。

这是它的截图

这是代码，我知道代码容易受到 SQL 注入。你可以忽略它。这仅用于测试目的

之前 order_total_amount 列被设置为“VARCHAR”数据类型，然后有人建议它应该设置为“INT”。所以我把它从 Varchar 改成了 Int。但这并没有解决问题。尽管 0 值

条仍然显示

     <script type="text/javascript">
      google.charts.load('current', {'packages':['bar']});
      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {
        var data = google.visualization.arrayToDataTable([
          ['Monthly', 'Sales'],
          <?php   
            
    $sale_chart = "SELECT 
    SUM(IF(month = 'Jan', total, 0)) AS 'Jan',
    SUM(IF(month = 'Feb', total, 0)) AS 'Feb',
    SUM(IF(month = 'Mar', total, 0)) AS 'Mar',
    SUM(IF(month = 'Apr', total, 0)) AS 'Apr',
    SUM(IF(month = 'May', total, 0)) AS 'May',
    SUM(IF(month = 'Jun', total, 0)) AS 'Jun',
    SUM(IF(month = 'Jul', total, 0)) AS 'Jul',
    SUM(IF(month = 'Aug', total, 0)) AS 'Aug',
    SUM(IF(month = 'Sep', total, 0)) AS 'Sep',
    SUM(IF(month = 'Oct', total, 0)) AS 'Oct',
    SUM(IF(month = 'Nov', total, 0)) AS 'Nov',
    SUM(IF(month = 'Dec', total, 0)) AS 'Dec'
    FROM
    (SELECT 
        MIN(DATE_FORMAT(order_date, '%b')) AS month,
            SUM(order_total_amount) AS total
    FROM
        invoice_order
    WHERE
        user_id = '$user_id'
    GROUP BY YEAR(order_date) , MONTH(order_date)
    ORDER BY YEAR(order_date) , MONTH(order_date)) AS sale";

$sale_chart_query = mysqli_query($connection,$sale_chart) or die(mysqli_error($connection));

$sale_chart_array = mysqli_fetch_assoc($sale_chart_query);
            
          foreach($sale_chart_array as $x => $val) { ?>
          ['<?php echo $x; ?>','<?php echo $val; ?>'],
           <?php } ?>
        ]);

        var options = {
        
        };

        var chart = new google.charts.Bar(document.getElementById('chart_div'));

        chart.draw(data, google.charts.Bar.convertOptions(options));
      }
     </script>

将零替换为空后，结果就是这样显示的

Answer 1

在图表数据 table 中使用值 null 将防止出现柱状图。
请参阅以下工作片段...

在这种情况下，您在数据中包括字符串而不是数字 table。
从第二个数组值中删除单引号，这里...

['<?php echo $x; ?>',<?php echo $val; ?>],

google.charts.load('current', {
  packages: ['bar']
}).then(function drawChart() {
  var data = google.visualization.arrayToDataTable([
    ['Monthly', 'Sales'],
    ['Jan', 1000],
    ['Feb', null],
    ['Mar', null],
    ['Apr', null],
    ['May', 40000],
    ['Jun', null],
    ['Jul', null],
    ['Aug', null],
    ['Sep', null],
    ['Oct', null],
    ['Nov', null],
    ['Dec', null]
  ]);

  var options = {};

  var chart = new google.charts.Bar(document.getElementById('chart_div'));

  chart.draw(data, google.charts.Bar.convertOptions(options));
});

<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>

即使值为零，条形图也会出现 - Google 图表

Bars are showing up even when value is zero - Google Charts

mysql

charts

google-visualization

bar-chart