【カスタム可視化サンプル】カスタム棒グラフ

【概要】

既存の棒グラフには無い機能や調整ができる（逆に出来ないこともあるが）棒グラフです

一番下部にGeminiで生成したサンプルコードを置いてます。

※生成AIによる作成となります。利用は自己責任でお願いいたします。

【完成イメージ】　

https://scrapbox.io/files/69171eb9495d6b5d4649ddb0.png

【主な機能】

https://scrapbox.io/files/69171d26a1e7514fb6c8f3c5.png

メモの位置

1.座標指定による任意の場所

例えば対象ディメンション名、"薬学科"と入れおけば、データが更新されてもずっと"薬学科"の棒グラフに注釈を入れることが可能。

上限は10個

「棒」タブの「--- 区分線 (Series Connector) ---」から色々細かい設定が調整できる。

トータルの割合の変化量の表示

単純に値の変化量・率の表示

年月のフィールドを選んだときは、日付を指定する

年のフィールドを選んだときは、1月から12月を１つ指定する

https://scrapbox.io/files/6917267fab6a73c858536ef8.png

↑例：9月の最高気温のみ各年で比較したいときの設定（赤枠の中身を触っていけば出来るはず）

「x」タブで「--- 目盛り・補助線 ---」の各項目を入力

「値」タブの「---値ラベル---」の各項目を入力。特に、X軸で補助線を設定した値のみを選ぶと画像のように不要な値を消せる。

■ 目標線

3つの条件で設定可能

メジャーの値を使って動的に目標線を変えるパターン

この場合複数の値があると、複数の直線が引かれる（メジャーに1,5,10と3種類の値があれば3本引かれる）

派生テーブルで使う値を明確にしておいてクロスジョインで結合するのが良い。

固定値で指定

■ x軸を日本語の縦書に変更

「x」タブの「X軸ラベルを縦書きにする (日本語)」をオンにする

■ y軸の高さを任意の値 or メジャーの最大値 × 数値(110％)等で設定可能

「y」タブの「Y軸の最大値の指定方法 (自動 / データ最大値のX% / 固定値)」から選択

■ 条件付き書式

3つまで

【必要なデータ】

ディメンション１つの場合は通常の棒グラフ

積み上げ、100％積み上げ、(1つのy軸に複数の棒を)並べて表示を行いたい場合はいずれかの方法で

ディメンションを２つ選択(標準の棒グラフだと出来ない)し、メジャーを１つ選択

メジャーを２つ選択し、ディメンションを1つ選択

ピボットには非対応

【サンプルコード】

実装方法はこちらから

manifestファイル

code:manifest.lkml

visualization: {

id: "custom_bar_chart_highly_configurable"

label: "by Gemini カスタム棒グラフ" # Exploreのビジュアライゼーション選択メニューに表示される名前です

file: "custom_bar_chart.js" # JavaScriptファイル名

dependencies: [

]

}

Javascriptファイルは長いのでファイルで添付