php - 使用MySQL+PHP+Morris.js生成折线图

Question

我正在使用 MySQL+PHP+Morris.js 生成一些折线图。我希望结果图如下所示:

morris.js line graph

我理解 morris.js 生成图表的数据应如下所示:

{"period": "2014 Q3", "A": 75, "B": 77, "C": 79},
{"period": "2014 Q2", "A": 85, "B": 87, "C": 89},
{"period": "2014 Q1", "A": 93, "B": 95, "C": 97}

但是我在使用 PHP+MySQL 获取这种格式时遇到了麻烦。

我的数据库结构如下所示。

table1: numbers
ID  | name | time | number
------+------+------+---
1   | A    | 1    | 75
2   | A    | 2    | 77
3   | A    | 3    | 79
4   | B    | 1    | 85
5   | B    | 2    | 87
6   | B    | 3    | 89
7   | C    | 1    | 93
8   | C    | 2    | 95
9   | C    | 3    | 97


table2: times
ID  | time   
----+------  
1   | 2014 Q1
2   | 2014 Q2
3   | 2014 Q3

有没有办法获得所需的格式 morris.js ？或者是否有其他方法可以使用其他类型的格式生成图表？希望我不必更改数据库的结构:(

非常感谢!

Answer 1

你可以尝试这样的事情

<div>
   <div id="some_line_graph"></div>
   <?php
      try {
      $db = connectPDO();
      $row = $db->prepare("SELECT name, number FROM numbers"); //for the sake of argument and simplicity I leaved the most simple SQL
      $row->execute(); 
      $json_data=array();  
      foreach($row as $rec)  
      { 
      // value on x axis 
      $json_array['label']=$rec['name'];  
      // value on y axis 
      $json_array['value']=$rec['number'];  
      array_push($json_data,$json_array);
      } 

      ?> 
   <script type="application/javascript">
      Morris.Line({
      element: 'some_line_graph',
      // json_encode returns JSON representation of a value
      data: <?php echo json_encode($json_data,JSON_UNESCAPED_UNICODE)?>,
      xkey: 'label',
      ykeys: ['value'],
      // Set to false to skip time/date parsing for X values, instead treating them as an equally-spaced series.
      parseTime:false,
      labels: ['<b>Numbers graph example</b>'],
      resize: true
      });
   </script>
   <?php 
      closePDO($db);   
      } catch (PDOException $e) {
      showPDOErrors($e, $db);
      }
    ?>
</div>
<div>

因为您没有指出您想要显示的内容(列等)鉴于您还没有确切地说出您要寻找的内容，我做了最简单的查询/示例，希望它有所帮助!