可視化

用途

visualization: {
  id: "unique-id" 
  label: "Visualization Label" 
  url: "visualization_url" 
  sri_hash: "SRI hash" 
  dependencies: ["dependency_url_1","dependency_url_2"]
  file: "visualization_file_path" 
}
階層
visualization
デフォルト値
なし

特別なルール
visualization には、url パラメータまたは file パラメータのいずれかを含める必要があります。両方を含めることはできません。

定義

visualization パラメータは、LookML プロジェクトにカスタム ビジュアリゼーションを追加します。ユーザーは、プロジェクトの Explore の [可視化] タブからこのビジュアリゼーションにアクセスできます。カスタム ビジュアリゼーションは JavaScript ファイルで定義する必要があります。このファイルは LookML プロジェクト ファイルに含めることも、別の場所にホストすることもできます。

visualization パラメータには次のサブパラメータがあります。

パラメータ 説明
id Looker の [管理] メニューの [ビジュアリゼーション] ページに表示されるビジュアリゼーションの一意の識別子を指定します。
label プロジェクトの Explore の [ビジュアリゼーション] タブと、Looker の [管理] メニューの [ビジュアリゼーション] ページに表示されるビジュアリゼーションのラベルを指定します。
url url パラメータは、ファイルが Looker インスタンス外のサーバーに保存されている場合に、ビジュアリゼーションの JavaScript ファイルの URL を指定します。url パラメータを使用する代わりに、ファイルを Looker IDE にドラッグ＆ドロップしてから、file パラメータを使用してファイルを指定できます。

NOTE: アプリケーションには url パラメータまたは file パラメータのいずれか一方を含める必要があります。両方を含めることはできません。
sri_hash SRI ハッシュは、ビジュアリゼーションの JavaScript ファイルが url パラメータで指定されている場合にのみ使用されます。カスタム ビジュアリゼーション コードをホストするサイトで検証にサブリソース整合性（SRI）ハッシュを使用する場合は、sri_hash フィールドに SRI ハッシュを入力します。
dependencies ビジュアリゼーションのロードに必要なディペンデンシー URL の、コンマで区切りのリストを提供します。
file ビジュアリゼーションを定義する JavaScript ファイル（.js 拡張子付き）へのパスを指定します。このパスは、プロジェクト ルートからの相対パスです。次の列の例は、LookML プロジェクトの visualizations ディレクトリにある calendar-heatmap.js ファイルを指しています。

NOTE: アプリケーションには url パラメータまたは file パラメータのいずれか一方を含める必要があります。両方を含めることはできません。

例: LookML プロジェクトにカスタム ビジュアリゼーションの URL を追加する

LookML プロジェクトにカスタム ビジュアリゼーションを追加する方法の 1 つは、カスタム ビジュアリゼーション ファイルの URL を使用することです。たとえば、プロジェクトのマニフェスト ファイルに次の LookML を追加すると、Looker プロジェクトに複数値の CDN カスタム ビジュアリゼーションが追加されます。このビジュアリゼーションは、Looker の Marketplace にある JavaScript ファイルで定義されています。

visualization: {
  id: "spider-marketplace-dev"
  label: "Spider Viz"
  url: "https://marketplace-api.looker.com/viz-dist/spider.js"
  sri_hash: "oqVuAfXRKap7fdgcCY5uykM6+R9GqQ8K/uxy9rx7HNQlGYl1kPzQho1wx4JwY8wC"
  dependencies: ["https://code.jquery.com/jquery-2.2.4.min.js","https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.9.1/underscore-min.js","https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js","https://cdnjs.cloudflare.com/ajax/libs/d3-legend/1.13.0/d3-legend.min.js"]
}

変更をコミットして本番環境にデプロイすると、Looker はプロジェクトの Explore の [ビジュアリゼーション] タブにカスタム ビジュアリゼーションの名前をオプションとして表示します。

ビジュアリゼーションは、Looker の [Admin] メニューの [Platform] セクションにある [Visualizations] ページにも表示されます。詳細については、管理者設定 - ビジュアリゼーションのドキュメント ページをご覧ください。

例: LookML プロジェクトにカスタム ビジュアリゼーション ファイルを追加する

別の方法として、Looker IDE を使用してカスタム ビジュアリゼーションの JavaScript ファイルを LookML プロジェクトに追加することもできます。

  1. Looker IDE で、カスタム ビジュアリゼーションを定義する JavaScript ファイルを LookML プロジェクトにドラッグ＆ドロップします。
  2. 必要に応じて、Looker IDE で可視化ファイルをフォルダに移動するか、可視化ファイルの新しいフォルダを作成します。
  3. ファイル ブラウザ パネルでビジュアリゼーション ファイルをクリックしてファイルの内容を表示し、[保存] をクリックしてファイルを保存します。
  4. プロジェクトのマニフェスト ファイルで、可視化パラメータを定義します。たとえば、次の LookML は、Looker プロジェクトに放射状ゲージのカスタム ビジュアリゼーションを追加します。ビジュアリゼーションは、LookML プロジェクトの visualizations ディレクトリにある JavaScript ファイルで定義されます。
  visualization: {
  id: "radial_gauge"
  label: "Radial Gauge"
  file: "visualizations/radialgauge_v2.js"
   }

  1. 変更を commit し、本番環境にデプロイします。

    Explore で顧客の可視化オプションを表示するには、可視化の更新をデプロイする必要があります（開発モードでも、更新の保存だけでは不十分です）。

更新をデプロイすると、Looker はカスタム ビジュアリゼーションの名前を、プロジェクトの Explore の [ビジュアリゼーション] タブのオプションとして表示します。

ビジュアリゼーションは、Looker の [管理者] メニューの [プラットフォーム] セクションにある [ビジュアリゼーション] ページにも表示されます。詳細については、管理者設定 - ビジュアリゼーションのドキュメント ページをご覧ください。