Question

我想在谷歌堆积柱形图中显示我的数组。我生成的数组看起来像这样。

array(n) { ["5pm"]=> int(4) ["6pm"]=> int(0),... } //Monday
array(n) { ["5pm"]=> int(5) ["6pm"]=> int(1),... } //Tuesday
...
array(n) { ["5pm"]=> int(4) ["6pm"]=> int(2),... } //Sunday

数组中的条目数需要变化（取决于数据库中的条目，但所有日期都相同）。

谷歌图表中的JS需要看起来像这样

var data = google.visualization.arrayToDataTable([    
    ['Hours', '5pm', '6pm',...],
    ['Mon', 4, 0],
    ['Tue', 5, 1],
       ...
    ['Sun', 4, 2]
]);

感谢您的帮助;）

Answer 1

Heer是一个示例代码，我从PHP＆amp;将其传递给JavaScript以绘制图表。有一件事需要检查所有行应该具有相同数量的元素。

所以，根据你的问题，所有＆＃34;时间段＆＃34;行应该具有相同数量的元素，它不起作用。

<?php
$chartData = array(
        array('Year', 'Sales', 'Expenses', 'Profit'),
        array('2014', 1000, 400, 200),
        array('2015', 1170, 460, 250),
        array('2016', 660, 1120, 300),
        array('2017', 1030, 540, 350)
    );
$chartDataInJson = json_encode($chartData);
?>

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

      function drawChart() {

        var data = google.visualization.arrayToDataTable(<?php echo $chartDataInJson; ?>);

        var options = {
          chart: {
            title: 'Company Performance',
            subtitle: 'Sales, Expenses, and Profit: 2014-2017',
          }
        };

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

        chart.draw(data, google.charts.Bar.convertOptions(options));
      }
    </script>
  </head>
  <body>
    <div id="columnchart_material" style="width: 800px; height: 500px;"></div>
  </body>
</html>

希望它能清除你所有的疑问。

如何在Google Chart中显示PHP数组

1 个答案: