2016-06-21 3 views
0

私はMySQL + PHP + 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が必要ですか?あるいは、他の種類の形式を使ってグラフを生成する他の方法はありますか? うまくいけば、私は私のデータベースの構造を変更する必要はありません:(

おかげで多くの!

答えて

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> 

ような何かを試すことができます表示する(列など) あなたが探しているものを正確に言っていないとすれば、私は最も単純なクエリ/例を作った、それが助けてくれることを願っています!

関連する問題