質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

87.59%

【PHP】SQLの集計結果を折れ線グラフなどで表示させたい。

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 6,014

score 86

WEBページに、PHPでMySQLのデータを集計し、 表を表示させていたのですが、欲が出てきて、 さらにグラフを表示させたくなりました。 SQLは下記の通り実行させていています。

//SQLはファイルから読み込む $sql_3 = file_get_contents("test3.sql");

// SQLクエリを実行する $result_3 = mysqli_query($link, $sql_3);

この状態で、mysqli_fetch_arrayを実行すれば連想配列の 状態で取得できると思っていて、 $data = mysqli_fetch_array($result_3,MYSQLI_ASSOC);

とりあえず、この$dataをCSVに掃き出させ、それからグラフ化しようと考えました。

$fp =fopen('test.csv','w');     foreach ($data as $fields){     fputcsv($fp, $fields);     }     fclose($fp);

しかし、CSVファイルには何も掃き出されず、困っています。 参考にしたサイトは、 http://qq3q.biz/pMcQ です。 CSVファイルからグラフ作成をしているようです。 別に他にグラフ化できる方法があれば、無理にCSVを使う必要はないと思っています。

他にも、 http://lab.sonicmoov.com/development/morris-js-php-graph/

このサイトを参考にJSON形式への変換も試みましたが、 ダメでした。

$logJson = json_encode($data);

直接サーバにインストールすることはできないので、 JpGraphを使った方法はできないかなと思っています。

何か、解決方法等があれば教えてください。

【追記】 現在、GoogleChartsで折れ線グラフに挑戦中です。 しかし、JSON形式のデータがうまく取り込めず苦しんでいます。 単なる、{項目:値}の形式ではないので、多次元配列やら、jQueryでの処理やらが必要かと思います。

希望する折れ線グラフは、横軸に月(今月(this)、1ヶ月前(one)…)、縦軸にアクセス数で、各アクセスタイプごとに線が引かれる形式です。 JSON形式に出力したファイルの一部を記載します。 【JSON】 {"access_type":"\u30e1\u30cb\u30e5\u30fc(101)","this":"10","one":"76","two":"59","three":"26","four":"59","five":"0","six":"0","seven":"0","eight":"0","nine":"0","ten":"0","eleven":"0","year":"0"} {"access_type":"\u7c21\u5358\u30ca\u30d3(201)","this":"5","one":"40","two":"15","three":"0","four":"0","five":"0","six":"0","seven":"0","eight":"0","nine":"0","ten":"0","eleven":"0","year":"0"}

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 1

checkベストアンサー

+3

GoogleCharts であれば、JavaScript で実装できますよ。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2015/12/11 19:11

    デモは実行してみました。
    Ageが横軸ですね。

    jQueryでのJSONファイルの処理方法について調べたほうがよさそうだと今更思いました。
    来週、続きに挑戦してみます。

    キャンセル

  • 2015/12/11 19:16

    JSONの読み込みは確かにjQuery を使うと楽です。

    キャンセル

  • 2016/01/07 14:13

    遅くなりましたが、GoogleChartsでグラフ表示(JSONファイルから読み込み)が
    できるようになりました。
    結局、JSONデータの方を、GoogleChartsで読める形に、JavaScroiptで加工しました。

    【加工前】
    {"access_type":"(101)","this":15,"one":76,"two":59,"three":26},
    {"access_type":"(102)","this":7,"one":44,"two":6,"three":0}

    これを下記のような縦と横を入れ替えた感じのJSONデータに加工しました。
    【加工後】
    [["","(101)","(102)"],["this",15,7],["one",76,44],["two",59,6],["three",26,0]]

    それで、ようやく希望通りのグラフとなりました。
    どうも有難うございました。
    解決済みにします。

    キャンセル

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 87.59%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る