Easy Charts:チャートやグラフを簡単に投稿に挿入できる

2017年7月10日

投稿でチャートやグラフを表示させたい時があると思います。
そのような時に便利な WordPress 用プラグインがあります。
それは「Easy Charts」です。
そのインストール手順から日本語化・使い方と設定などを解説していきます。

Easy Charts

Screenshot of wordpress.org

Easy Charts は、インタラクティブなチャートやグラフを簡単に投稿に挿入できます。
作成したチャートやグラフは、ショートコードもしくはビジュアルエディタから、
投稿や固定ページに簡単に追加できます。
ライブプレビュー機能も備えて、どのように見えるのかも簡単に確認できます。

サポートされているチャートは、以下のとおりです。

  • 棒グラフ
  • 積み上げ棒グラフ
  • ステップアップ棒グラフ
  • パーセント棒グラフ
  • エリアチャート
  • 積み重ねられたエリアチャート
  • パーセント面積グラフ
  • 折れ線グラフ
  • 円グラフ
  • ドーナツチャート
  • ポーラーエリアチャート
  • ウォーターフォールチャート

Easy Charts は、Javascript ライブラリの一つである uvCharts を利用しています。
uvCharts – GitHub

記事を作成もしくは更新時点でのバージョン:v 1.2
マルチサイトでの利用:可

インストール手順

下記の URL から ZIP ファイルを入手して、管理画面からアップロードして有効化するか
Easy Charts – WordPress.org

もしくは、WordPress.org の公式プラグインディレクトリにリリースされているので、
管理画面から入手できます。

ダッシュボードから「プラグイン」メニューの「新規追加」を選択し、
プラグイン追加画面右上の検索窓に「Easy Charts」と入力します。

WordPressプラグイン「Easy Charts」のスクリーンショット

検索結果の一番左上に表示されると思うので、「今すぐインストール」をクリックします。
※一番左上に表示されない場合は、上記の画像から探して下さい。
インストールが完了したら、プラグインを「有効化」します。

プラグインのインストールに慣れていない方は、
下記の記事にて詳しく解説していますので、御覧ください。

WordPressプラグインのインストール手順を解説 – WordPress活用術

日本語化

Easy Charts を有効化した際に日本語化されない場合には、
日本語化用の言語パックを translate.wordpress.org から入手できる場合があります。

WordPress と関連プロジェクト(テーマ・プラグイン)用の翻訳プラットフォームとして、
translate.wordpress.org (GlotPress) が導入されています。

※ボランティアで翻訳されている場合が多いので、
全てのプラグインで、必ずしも日本語化用の言語パックが用意されているわけでは無いです。
また、用意されていても 100% 翻訳されている保証もありません。

日本語化用の翻訳ファイルの探し方は、下記の記事を参照してください。

WordPress公式での日本語化用の翻訳ファイルの探し方 – WordPress活用術

専用メニュー

WordPressプラグイン「Easy Charts」のスクリーンショット

ダッシュボードの「コメント」メニューの下に追加されています。

使い方

「Add New」メニューを開いて、
チャートで表示したいデータを入力し、チャートの種類や必要な設定をしていきます。
プレビュー機能は、「Update chart data」ボタンをクリックしてから保存すると表示されます。

WordPressプラグイン「Easy Charts」のスクリーンショット

各チャート作成画面で表示されているショートコードをチャートを表示したい箇所に貼り付けるか

WordPressプラグイン「Easy Charts」のスクリーンショット

WordPressプラグイン「Easy Charts」のスクリーンショット

投稿画面のビジュアルエディターに追加されているチャート追加ボタンからショートコードを挿入できます。

Configuration

WordPressプラグイン「Easy Charts」のスクリーンショット

17 種類のメニューから様々な設定ができます。

General

WordPressプラグイン「Easy Charts」のスクリーンショット

Meta

WordPressプラグイン「Easy Charts」のスクリーンショット

Dimension

WordPressプラグイン「Easy Charts」のスクリーンショット

Margin

WordPressプラグイン「Easy Charts」のスクリーンショット

Frame

WordPressプラグイン「Easy Charts」のスクリーンショット

Axis

WordPressプラグイン「Easy Charts」のスクリーンショット

Label

WordPressプラグイン「Easy Charts」のスクリーンショット

Legend

WordPressプラグイン「Easy Charts」のスクリーンショット

Scale

WordPressプラグイン「Easy Charts」のスクリーンショット

Tooltip

WordPressプラグイン「Easy Charts」のスクリーンショット

Caption

WordPressプラグイン「Easy Charts」のスクリーンショット

Subcaption

WordPressプラグイン「Easy Charts」のスクリーンショット

Bar

WordPressプラグイン「Easy Charts」のスクリーンショット

Line

WordPressプラグイン「Easy Charts」のスクリーンショット

Area

WordPressプラグイン「Easy Charts」のスクリーンショット

Pie

WordPressプラグイン「Easy Charts」のスクリーンショット

Donut

WordPressプラグイン「Easy Charts」のスクリーンショット

URL

Easy Charts – WordPress.org

本ページはアフィリエイトプログラムによる収益を得ています