使用MySQL + PHP + Morris.js

时间:2016-06-21 13:23:23

标签: php mysql morris.js

我正在使用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得到?或者有没有其他方法使用其他类型的格式生成图形? 希望我不必更改数据库的结构:(

非常感谢!

1 个答案:

答案 0 :(得分:0)

你可以尝试这样的事情

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

因为你没有指出要展示的内容(列等) 鉴于你没有准确地说出你想要的东西,我做了最简单的查询/例子,希望它有所帮助!