カテゴリー
WordPress運営日誌»WP関連古記事»plug-in»

表のデータをグラフ化するWordPressプラグイン「WordPress Charts and Graphs Lite」

2013-08-06_1201
エクセルやGoogleドライブのスプレッドシートなどのデータをグラフ化してくれるWordpressプラグイン「Visualizer」を紹介します。@web_shufuはグラフをサイト上にきれいに描画できるツールを探していましたが、最終的にこのプラグインに落ち着きそうです。

インストール・有効化

Visualizerのインストールはとても簡単です。

WordPress管理画面左サイドバーから「プラグイン」⇒「新規追加」と進んで、「WordPress Charts and Graphs Lite」と打ち込み、インストール・有効化します。

9種類のグラフが描ける

Visualizerは9種類のグラフに対応しています。

  • 円グラフ
  • 折れ線グラフ
  • 面グラフ(エリアチャート)
  • ジオチャート
  • 縦棒グラフ(バーチャート)
  • 横棒グラフ(コラムチャート)
  • ゲージチャート
  • 散布図(スキャッターチャート)
  • ロウソク足(キャンドルスティックチャート)

@web_shufuは最初の2つくらいしか使いそうにありませんが、これだけあればグラフを多用する人のニーズにも応えられそうです。

CSVファイルをインポートしてグラフ化

VisualizerのいいところはCSVファイルのインポートでデータ入力を行うところです。

エクセル・Googleドライブスプレッドシートなど、自分が使い慣れた表計算ソフトで入力したデータを簡単にグラフ化できます。

CSVファイルのインポートはWordpress管理画面左サイドバー「メディア」⇒「Visualizer library」から行います。

以下の画面で「Add new」をクリック。
2013-08-06_1126

円グラフのラジオボタンをチェックして「Next」をクリック。
2013-08-06_1128

すると右側に「Upload CSV file」というコーナーが出てきます。PC上のCSVファイルもウェブ上のCSVファイルも自由にアップロードできます。
2013-08-06_1129

データの入力方法とCSVファイルのアップロード方法については開発元が記事を書いてくれています。

完成したグラフはショートコードで貼り付け

CSVファイルをアップロードした後「Next」を押すと以下の画面になります。「Create Chart」を押します。
2013-08-06_1139

すると以下のようにグラフ貼り付け用のショートコードが表示されます。
2013-08-06_1140

あとは記事中のグラフを表示したい場所にこのショートコードを貼り付けるとOK。こんな感じになります。

[visualizer id=”2266″]

データを多用するブロガーにオススメ

データというのは記事に客観性を与え信用性を増すために必要不可欠ですが、単なる数字の羅列では無味乾燥です。

しかし、グラフ形式でデータを表示することで、ビジュアル要素が加わって一挙に読みやすくなります。

数字にこだわる硬派な記事を沢山書くブロガーさんにVisualiserはとてもオススメです。

なお、データを読みやすくするにはグラフとともに表も重要です。

WordPressの記事中にエクセルやGoogleドライブのスプレッドシートなどのデータで作った表を貼り付けるなら「Table Press」が便利です。

以下の記事を参考に。



「表のデータをグラフ化するWordPressプラグイン「WordPress Charts and Graphs Lite」」への8件の返信

とても簡単に使えて驚きました!

しかし、グラフの日本語表示はできないみたいですね。。

実際やる方法があれば教えていただけますか。

よろしくお願いします。

rei様コメントありがとうございます。
実は私も日本語表示の方法を知りません。
お役に立てずすいません。
今後ともよろしくお願いいたします。

非常に分かりやすく、参考にさせていただきました。
ありがとうございます。

上のコメントからかなり日がたっていますが、私も日本語のアップで見事に躓いたので、もしかしたらけっこう多くの方が日本語がアップできないというところで悩んでいるのではないかと思い、コメントします。
よろしければお役立てください。

原因はUTF-8になっていないという単純なものなのです。
Kingsoftでcsvを作ってサクラエディタなどでUTF-8にすると、いつもは勝手に変換されている文字が表示されていなかったり、使っていない文字に勝手に変換されていたりしました。
これをそのままアップしたらエラーが起こり、グラフ自体がアップできません。

エラーになっている部分(日本語全般)を打ち直して再度アップしたところ、無事にアップできました。

折れ線グラフを使いたくてプラグインを探してました!
パソコン上やgoogleに置いたcsvからグラフ化できるのすごく便利ですね

1つ困っているのが折れ線グラフのx軸やy軸の最大値を指定することは出来るかということです
もしご存知でしたら指定の仕方を教えていただけないでしょうか?

ぴよさん、コメントありがとうございます。

ただ、お尋ねの件については、分かりかねます。

このプラグインを使う機会があまりなく、外してしまいました。

お役に立てずすいません。。。

Wordpressに綺麗なグラフやチャートを表示するプラグインまとめ – My Tips and Quotesの発言:

[…] 表のデータをグラフ化するWordpressプラグイン「WordPress Charts and Graphs Lite」 […]

この記事のアイキャッチに
[こんなグラフが簡単に描けます。]
と赤色の枠で書いていますが、あれはどのようにして表示させていますか?
画像でしょうか?
プラグインでしょうか?

こういちさん、こんにちは。

Jingという画像ソフトで書きました。

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です