【カスタム可視化サンプル】アドバンスド・クロスフィルター（更新ボタンを押す必要なし）

【完成イメージ】　

https://www.youtube.com/watch?v=yk9xEDG_5Lw

【概要】

カスタムvizを使ったフィルター。標準のフィルターでは出来ないことが出来ます。

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

※コードはGeminiにより作成されている部分があります。またカスタム可視化は公式のサポート外となりるため、利用は自己責任でお願いいたします。

【👍️標準のフィルターよりも優れてる点】

フィルターをかけるときに更新ボタンを押す必要がない。

cf.標準のフィルターは上部 or 右側しか置けない

細やかなデザイン

パーツごとの背景、透過度合いなど

背景を画像にすることも可能。

https://scrapbox.io/files/6921cea2bfa9b6c6e9d5ea89.png

上記の画像置き場(もし使うことあれば、、用です)

【❌️標準のフィルターよりも悪い点】

クエリコストが増える懸念（クロスフィルタリングの特性）

タイルフィルターだとクリック数が減るのでフィルターを安易に出来てしまうが故に、その分クエリコスト増加の可能性が生じる。

クロスフィルタリングの仕様上、複数選択するときは１つ１つフィルターが適用されていき、まとめて複数のフィルターを処理することができないので、都度クエリが発生。

標準のフィルターで出来るような、今日の日付に基づいたフィルターなどの細かい条件指定は、現状できない。

但し、部分一致 / 除外検索 / 数値範囲 /正規表現での検索は実装済み。

もし、新たな機能が欲しい場合は本ページのコードをGemini等に入力して修正指示依頼すれば出来る可能性あり

あくまでもカスタムviz

公式のサポートは受けることは出来ない。自己責任での利用となる。

【必要なデータ】

マスト：ディメンション1つ

任意：データバー等で表したいメジャー

【サンプルコード】

実装方法はこちらから

javascriptファイル

manifestファイル

code:manifest.lkml

visualization: {

id: "custom-advanced-cross-filter"

label: "Advanced Cross Filtering"

file: "advanced_cross_filtering.js"

# 外部ライブラリ依存なしのためdependenciesは省略

}