病的溺愛シンドローム > web制作者のメモ帳 > WordPress Tips > WordPressで簡単にグラフを作成 – Simple Graphプラグイン

WordPressで簡単にグラフを作成 – Simple Graphプラグイン

Posted on 2009年05月28日 | 8 Comments

Google Chart APIを利用してグラフを表示させるWordPressのプラグインはいくつか見つけたんだけど、どれも設定が難しく…。
細かいパラメータとかデータとか全部手入力するなら、プラグインいらないじゃん。とか。
頭からぐもも～んと煙を出しながら簡単にグラフを作れるプラグインを探してみた。

辿り着いたのがSimple GraphというWordPressプラグイン。
基本的にはウィジェットにグラフを表示させるもの。
（後述するけど投稿やページにも貼れる。）

サイドバーに表示できるグラフのサンプル

インストールはいつも通りプラグインディレクトリにアップロードして
有効化するだけで使えるようになる。

データの追加と削除などの設定は「ツール」→「Simple Graph」から。

Simple Graphデータ追加画面

グラフは複数作成することができる。
データを追加するグラフ番号を選んで、日付と値を入力。
「Inser data」をクリックして保存する。
一度にまとめて入力することもできる。（多分上級者向け）

データを入力したら「外観」→「ウィジェット」からグラフを追加する。

ウィジェットでグラフの設定をする

グラフは画像で生成される。
Google Chart APIを利用して描画することもできるけど
あたしの環境ではうまく動かなかったのでそれはオフにしてる。
グラフのサイズや色など、ここで細かく設定できる。

本来はこのプラグインって体重管理用みたいだけど、
ダイエットグラフに限らずいろんなことに使えそう。
あたしは非公開記事に猫達の食事量を記録するのに使いたかったんだ。
ということで、次はサイドバーに表示されるグラフを記事に貼ってみよう。

ウィジェットで設定するとサイドバーにグラフ画像が表示されるので
グラフを右クリックして画像のURLをコピーする。
投稿（ページ）内にコピーしたURLの画像を貼り付ける。
こんな感じ↓

PLAIN TEXT
HTML:
  1. <img src="http://yuina.lovesickly.com/wp-content/plugins/simple-graph/grapher/graph.php?n=1&amp;uid=2&amp;tid=1&amp;l=1&amp;w=180&amp;h=180" alt="聖の食欲グラフ" />

これだけでOKなんだけど、サイドバー用の大きさだと見づらいので
タグ内の大きさの部分を任意に変更。
例えばこんな感じ↓

PLAIN TEXT
HTML:
  1. <img title="聖" src="http://yuina.lovesickly.com/wp-content/plugins/simple-graph/grapher/graph.php?n=1&amp;uid=2&amp;tid=1&amp;l=1&amp;w=400&amp;h=200" alt="聖" width="400" height="200" />

ダイエットグラフとして使いたい場合も、
グラフを月別に作成して、ページにずらっと貼っておけば
長期間の体重推移が一目で分かるページの完成。

これは自分用になかなかいいWordPress プラグインだと思った。
うむ。気に入ったcool0003.gif



関連記事：


この記事は 2009年05月28日木曜日 の 11:53 PM に書きました。　
この記事のフィードはRSS 2.0で購読できます。

« | »

7 Comments for this entry

  • おいち
    5月 29th, 2009 on 2:18 AM

    (#^.^#)/こんばんは～♪
    おぉ～、今日は　お家芸とも云えるプラグインの記事かぁ～♪
    グラフなんだ！
    本来は体重管理用なんだね（笑
    ・・・なのに、実験されてるのは
    長女聖の食欲なんだ！、　これって何故かな～？

    思えば、聖は唯奈さんにどしゃぶりの雨の中を救われた奇遇の娘だから
    君も、特に思い入れはある筈だけど・・・
    いろんな特技も持ってるよね～、入れない出れない筈の部屋も
    ドアノブ回して、侵入してくる冒険家でもあるね＾＾
    その一方で「おんもが嫌だ」という意外な一面まで持ってるｗｗ
    ホント、かわいい娘だよ＾＾
    先日の病院での診察も、あの後　何もなければ、いいけど・・・
    藪獣医では？・・・何て、優しい唯奈は心配してたよね！

    何か、グラフのプラブインの話が長女聖メインになってしまいましたが
    これからも、聖と仲良くネ！
    聖も、猫ながら　きっと感謝の気持ちで一杯だと思いますよ＾＾
    そして、いつまでも長生きして　
    あなたのイス直下という特等席に居続ける事が
    この娘の願いのような気がいたしますｗ

    返信
    • 唯奈
      5月 29th, 2009 on 9:38 PM

      ＞おいちさん
      (*^-^*)/こんばんは～♪
      元々猫達の食事量をグラフ化したいと思って探したのがグラフプラグインだったんです。
      非公開設定のページに食事グラフの一覧を作成中です。
      グラフのURLをコピーするためにウィジェットに追加しないといけないわけですが、とりあえず聖のデータを入れてテストしてみたというだけで、聖だけ記録してるわけではないですｗ
      っていうか、聖のエピソードまで覚えていて下さってありがとうございます。
      いつもながらおいちさんの記憶力には脱帽です。
      不安な獣医の件、その後同じ病院の違うドクターに診てもらい、聖は便秘以外問題なさそうです。
      下剤を処方されました。効果が出てないのでまた病院行きです。
      椅子の下を占拠するのは碧だったり櫻だったりします。
      聖と雅はあんまり見えるところにいないヒキコモリータですｗ
      櫻のできものは経過観察中です。
      １ヶ月後にまた病院に連れて行きます。
      お気遣いありがとうございます＾＾

      返信
  • おいち
    5月 30th, 2009 on 6:15 AM

    (#^.^#)/おはようございます♪
    今回は、「聖の食欲グラフ」というテーマであったので
    食欲＝健康状態を想定しました。

    その時、通院中の聖の身に何かあったのでは・・？と考えたのですｗ

    正直、この記事コメントで一部書き綴ってもよい内容か？
    自分の中で葛藤もあったのですが、
    秘匿性を大事にする、あなた自身の事ではなく
    猫ちゃん「聖」の話ですので
    ブログ上でも何度か紹介しているし「表舞台にたってもいい」、
    そう判断しました！

    以前あなたに
    「コメントのレスは管理人自身に投げかけるものですから・・・」と言われ
    吹っ切れたことがありました。
    それ以来は、容赦のないコメント攻撃ですが
    誰かさんに直接、関与することだけは私の中でＮＧとして
    ルール化させているんです（多少のグレーゾーンはあるが・・・

    えっ、いつもながら私の記憶力に脱帽～♪
    ≧(´▽｀)≦アハハハハハ
    でも、今回は１００点ではないようですよ（ここでは、聖の定位置が違うよう
    とにかく、聖ちゃん　♪
    ただの便秘でよかった～♪(＠＾▽＾＠)ﾆｺｯ

    返信
    • 唯奈
      5月 31st, 2009 on 1:47 AM

      ＞おいちさん
      (*^-^*)/こんばんは～♪
      ブログに公開してないプライベートな情報はNGですが、猫のこととかは全然大丈夫です。
      あんまり気にしないでコメント書いてOKですよ＾＾

      ちなみに今サイドバーに表示されたままになってる聖の食事データはかなり古いです。
      試験設置のまま実は進んでないっていう＾＾；

      返信
  • cyah
    5月 30th, 2009 on 11:06 PM

    ＞ダイエットグラフとして使いたい場合も、
    グラフを月別に作成して、ページにずらっと貼っておけば
    長期間の体重推移が一目で分かるページの完成。

    私は自分の体重一般公開する自信がありません。
    唯奈さんが実行されたら「勇者」の称号を差し上げましょう。
    （スタイルには自信があるので、問題なし？）

    返信
    • 唯奈
      5月 31st, 2009 on 1:57 AM

      ＞cyahさん
      あたしも体重を公開する自信はありません＾＾；；；
      ページにずらっと貼るとしても非公開設定にしますｗ
      そういえば、ダイエット…また三日坊主になってるなぁ…(　= =) ﾄｵｲﾒ

      返信
  • 唯奈
    7月 13th, 2009 on 6:29 PM

    ＞くだらない話＠とむさん
    リンク＆トラバありがとうございます。

    返信

1 Trackback or Pingback for this entry

コメント

XHTML:タグが使えます：　<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

:zzz: :wink: :v: :uwa-n: :un: :twisted: :sikusiku: :rose: :roll: :photo: :oteage: :oops: :obake: :niyari: :nice: :naku: :munekyun: :mrgreen: :meramera: :lovelove: :love: :lol: :ke: :kanpai: :kaminari: :kame: :ikari: :ice: :hint: :heart: :hatena: :gurume: :gun: :evil: :ehe: :denden: :cry: :check: :cat: :bye: :boon: :blue: :bikkuri: :be-: :ashi: :ase: :arrow: :akubi: :?: :-| :-x :-o :-P :-D :-? :) :( :$: :!: 8-O 8)

ビールをおごる

Image of a beer - if this shows instead of the picture, you did not install the plugin corectly
153 Beers Received

サイトの歩み

2010年2月27日に2周年を迎えます
2周年まであと…

レキシ…

オープンから
1 year, 11 months, and 11 days 経過。
97.6% done