データベーステーブルのデータを利用してグラフやチャートが作れる:SQL Chart Builder

2018年12月19日

データベースには、WordPress 本体が利用するテーブル以外にも作成できます。
一部のサードパーティ製のプラグインでも専用テーブルを作成し利用しています。
保存されているなら、自分でも利用してグラフやチャートを作成したい。
そのような時に便利な WordPress 用プラグインがあります。
それは「SQL Chart Builder」です。
そのインストール手順から日本語化・使い方と設定などを解説していきます。

SQL Chart Builder

Screenshot of wordpress.org

SQL Chart Builder は、データベーステーブルのデータを利用してグラフやチャートが作れます。
データの抽出には SQL 文を記述して抽出します。
複数の SQL クエリーを使用して、比較チャートを作成することもできます。

SQL クエリーには、引数や動的変数を割り当てることができます。
グラフやチャートの表示には、ショートコードを貼り付けるだけです。

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

Gutenberg エディターでの動作

Gutenberg エディターに追加される機能は無いので、気にする必要は無いです。

Gutenberg エディターでのショートコードの挿入手順

このプラグインは、ショートコードを使用します。
挿入手順については、下記の記事にて詳しく解説していますので、御覧ください。

https://www.hiskip.com/wp/notes/9402.html

インストール手順

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

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

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

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

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

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

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

日本語化

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

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

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

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

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

専用メニュー

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

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

管理画面

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

※ショートコードは、各編集画面にしか表示されません。

使い方

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

タイトルを入力し、チャートのタイプを選択します。

Show table-view data below the graph
グラフやチャートの下にデータを合わせて表示するかどうか。

Your SQL code
データベーステーブルからデータを抽出するための SQL 文を記述します。
半角のセミコロン「;」で区切ると複数の SQL 文を記述できます。

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

パイチャート・ラインチャート・ドーナツチャート・垂直もしくは水平チャート・エリアチャートから選べます。

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

ここで動的フィルターを作成することができます。

例)
任意の名前:デフォルト値:グラフの上のフォームで表示されるラベル:数値(テキストまたは日付)
limit_tag:10:Count:number

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

  • Label for X axis
    クエリ引数のラベルテキスト(任意の名前)を入力します。
  • SQL field name of X axis
    X 軸とする SQL フィールド名を入力します。
  • Label for Y axis
    クエリ引数のラベルテキスト(任意の名前)を入力します。
  • SQL field name of Y axis
    Y 軸とする SQL フィールド名を入力します。
  • Width and height
    幅と高さを入力します。

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

1 度画面を保存するとショートコードが発行されます。

表示例

WordPressプラグイン「SQL Chart Builder」のスクリーンショット

ショートコード

下記のショートコードを使用することができます。

[gvn_schart_2 id = "99"]

URL

SQL Chart Builder – WordPress.org

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