2017-04-21 101 views
0

我想在谷歌堆積列圖表中顯示我的數組。我生成的數組看起來像這樣。如何在谷歌圖表中顯示PHP數組

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] 
]); 

感謝您的幫助;)

+0

你面臨的問題是什麼?另外,你在數組中的條目數目意味着什麼?需要改變(但對於所有日子來說都是一樣的)'''? – mi6crazyheart

+0

@ mi6crazyheart - 我認爲這意味着所有的日子都會有相同的時間段(例如下午5點 - 晚上10點),但是這個時間段可以根據數據庫中的內容而改變。 – ImClarky

回答

1

希爾是在那裏我從PHP &獲取數據傳遞的示例代碼,要的JavaScript繪製圖表。有一件事需要檢查,所有的行應該有相同數量的元素。

所以,根據你的問題,所有「時間段」行應該有相同數量的其他元素,它不會工作。

<?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> 

希望它能清除所有的疑問。

+0

這不完全是一個懷疑,但謝謝...它幫助了我很多,看看如何做到這一點...工程奇妙 –

+0

很高興知道它爲你工作。 – mi6crazyheart