php - 显示带有分组条的垂直条形图。

Question

我正在尝试使用谷歌图表创建条形图。我想每个月都显示销售订单和销售报价单的总值(value)。现在我这样做了，它只显示每个月的订单值，也以水平格式显示。我不知道如何使用单个条形图(垂直)显示这两个值

这是我的代码

$query = "SELECT MONTHNAME(last_modified) as month, 
                 orders.sales_order_id, 
                 orders.authorise, orders.company_id,
                 before_order_line_items.sales_order_id,
                 before_order_line_items.item,
                 before_order_line_items.uom, 
                 SUM(before_order_line_items.total) AS 'Total',
                 before_order_line_items.tax from orders INNER JOIN  
                 before_order_line_items ON
                 orders.sales_order_id ON    
                 before_order_line_items.sales_order_id  
           where orders.order_quote = 'Order' 
           AND orders.authorise='Yes' 
           GROUP BY MONTH(orders.last_modified) 
           ORDER BY MONTH(orders.last_modified)";

 $result = mysqli_query($con, $query);
  while ($row = mysqli_fetch_array($result))
    {
      $myurl[] = "['".$row['month']."', ".$row['Total']."]";

    }

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

        var data = google.visualization.arrayToDataTable([
          ['Month', 'Actuals'],
         /* ['2004',  1000,      400],
          ['2005',  1170,      460],
          ['2006',  660,       1120],
          ['2007',  1030,      540]*/


            <?php echo implode(",", $myurl); 

            ?>

        ]);

        var options = {
          title: 'Orders',
          vAxis: {title: '',  titleTextStyle: {color: 'red'}}
        };

        var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
        chart.draw(data, options);
      }
    </script>

Answer 1

首先，需要调整sql来返回两个值

然后将列添加到 $myurl[]

$myurl[] = "['".$row['Month']."', ".$row['Quotes'].", ".$row['Orders']."]";

从那里绘制图表，但建议使用 loader.js 与旧库 jsapi

像这样的东西应该很接近......

$query = "SELECT
            MONTHNAME(last_modified) as Month,
            SUM(case when orders.order_quote = 'Order' then before_order_line_items.total else 0 end) AS Orders,
            SUM(case when orders.order_quote = 'Quote' then before_order_line_items.total else 0 end) AS Quotes
          FROM orders
          INNER JOIN before_order_line_items
          ON orders.sales_order_id = before_order_line_items.sales_order_id
          WHERE orders.authorise = 'Yes'
          GROUP BY MONTH(orders.last_modified)
          ORDER BY MONTH(orders.last_modified)";

$result = mysqli_query($con, $query);
while ($row = mysqli_fetch_array($result)) {
  $myurl[] = "['".$row['Month']."', ".$row['Quotes'].", ".$row['Orders']."]";
}

<script src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
  google.charts.load('current', {
    callback: drawChart,
    packages: ['corechart']
  });

  function drawChart() {
    var data = google.visualization.arrayToDataTable([
      ['Month', 'Quotes', 'Orders'],
      <?php
        echo implode(",", $myurl);
      ?>
    ]);

    var options = {
      title: 'Orders',
      vAxis: {
        title: '',
        titleTextStyle: {
          color: 'red'
        }
      }
    };

    var chart = new google.visualization.ColumnChart(document.getElementById('chart_div'));
    chart.draw(data, options);
  }
</script>