数据不显示在谷歌条形图

Question

我想显示使用谷歌API图。即使我在数组中得到结果，它不会显示在图表中。

这里是我的代码

<?php 
$query = "SELECT 
      MONTHNAME(last_modified) as Month, 
      SUM(before_order_line_items.total) AS Quotes, 
      COUNT(orders.order_id) AS Qcnt 
      FROM orders 
      INNER JOIN before_order_line_items 
      ON orders.sales_order_id = before_order_line_items.sales_order_id 
      WHERE order.order_quote='Quote' AND orders.authorise = 'Yes' 

      GROUP BY MONTH(orders.last_modified) 
      ORDER BY YEAR(orders.last_modified) 
     ";  
$result = mysqli_query($con, $query); 
while ($row = mysqli_fetch_array($result)) { 
    $myurl[] = "['".$row['Month']."', ".$row['Quotes'].", ".$row['Qcnt']."]"; 
} 
?> 
<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', 'Counts'], 
     <?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> 
<div id="chart_div" style="height: 400px;"></div> 

当我检查我收到日期Qcnt也

function drawChart() { 
    var data = google.visualization.arrayToDataTable([ 
     ['Month', 'Quotes', 'Counts'], 
     ['May', 23299.00, 2] ]); 

的日期，但它是没有得到显示图中。只有报价金额正在显示。

Answer 1

为'Counts'值太小
和根本是不可见的，由于图表的规模......

你可以分配'Counts'系列第二y轴...

series: { 
    1: { 
    targetAxisIndex: 1 
    } 
}, 

看到下面的工作片段...

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

 
function drawChart() { 
 
    var data = google.visualization.arrayToDataTable([ 
 
    ['Month', 'Quotes', 'Counts'], 
 
    ['May', 23299.00, 2], 
 
    ['June', 23200.00, 2] 
 
    ]); 
 

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

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

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