このページでは、Looker Marketplace に追加して他の Looker ユーザーからアクセスできるようにすることが可能なタイプのカスタム ビジュアリゼーションを作成する方法について説明します。プロジェクト内で直接カスタム ビジュアリゼーションを作成し、他の Looker ユーザーには使用を許可しないようにすることも可能です。
Looker Marketplace にコンテンツを送信するには、Looker パートナー ネットワークのメンバーまたは Looker のお客様である必要があります。
Looker Marketplace では、Looker Blocks™ やアプリケーション、ビジュアリゼーション、その他のプラグインなど、さまざまな種類の Looker コンテンツの検索、デプロイ、管理を一元的に行うことができます。
Looker Marketplace 機能を有効にすると、Looker のお客様は Looker Marketplace プラグインをインストールできます。このプラグインには、Looker のネイティブ ビジュアリゼーション ライブラリに追加するビジュアリゼーション タイプが含まれています。
カスタム ビジュアリゼーションを開発し、Looker Marketplace 経由で Looker のすべてのお客様に提供するには、次の手順で作業を進めます。
- ビジュアリゼーションを開発する。
- ビジュアリゼーション用の Looker プロジェクトを作成する。
- Looker プロジェクトを Git リポジトリに push する。
- ビジュアリゼーションの機能をテストする。
- ビジュアリゼーションを Looker に送信する。
ビジュアリゼーション タイプを開発する
開発するビジュアリゼーション タイプを特定します(まだそのビジュアリゼーションが Marketplace に掲載されていたり、ネイティブの Looker ビジュアリゼーションとして提供されていたりしないことを確認してください)。
JavaScript 環境で Looker Visualization API を使用して、JavaScript でカスタム ビジュアリゼーションを開発します。
ビジュアリゼーション用 Looker プロジェクトを作成する
カスタム ビジュアリゼーションを表す Looker プロジェクトを作成します。プロジェクトには以下のファイルを含める必要があります。
LICENSE ファイル: 可視化が配布されているライセンスの一覧。次の文を使用します。
This Looker visualization is distributed with the following license:...
README.md
ファイル: ビジュアリゼーションの説明、機能、補足情報を記載します。JavaScript(
.js
)ファイル: ビジュアリゼーションの作成に使用した JavaScript コードの圧縮版が含まれています。Marketplace では、プロジェクト内に JS ファイルが含まれているため、適切なバージョニングとパッケージ管理が可能です。マニフェスト(
manifest.lkml
)ファイル:id
(一意の識別子)とlabel
(このビジュアリゼーションの Looker UI に表示されるもの)を指定します。次に例を示します。
constant: vis_id {
value: "default_id"
export: override_optional
}
constant: vis_label {
value: "default_label"
export: override_optional
}
visualization: {
id: "@{vis_id}"
label: "@{vis_label}"
file: "my_local.js"
sri_hash: "my_sri_hash"
dependencies: []
}
- リスティング(
marketplace.json
)ファイル: カスタム ビジュアリゼーション用の Marketplace リスティングを構成し、Marketplace におけるビジュアリゼーションの表示方法のラベル、image_uri
の場所、ビジュアリゼーションのユースケースを説明するタグラインを含めます。インストール時にユーザーが入力する Marketplace フィールド定数も定義します。次に例を示します。
{
"label": "Gauge Visualization",
"category_label": "plug-ins",
"branding": {
"image_uri": "https://marketplace-api.looker.com/visualization-screenshots/gauge_icon.png",
"tagline": "Use the Gauge visualization to display a measure and progress to a goal."
},
"constants": {
"vis_label": {
"label": "Visualization Label",
"description": "This label will appear in the visualization selector in the Looker Explore UI."
},
"vis_id": {
"label": "Visualization Id",
"description": "This must be a unique ID across all visualizations.",
"value_constraint": "visualization"
}
}
}
プロジェクトを Git に push する
一般公開の GitHub リポジトリでビジュアリゼーション LookML をホストします。Looker プロジェクトでビジュアリゼーションを作成した場合は、次の手順で新しいリポジトリに push します。
- 一般公開の GitHub リポジトリを作成する。
- Looker プロジェクトのリポジトリ URL を GitHub リポジトリの URL に設定する。
- Looker の Git プロンプトに従って、コードの検証、commit、本番環境へのデプロイを行います。
ビジュアリゼーションの機能をテストする
作成したビジュアリゼーションを Looker インスタンス上の適切な Explore または Look に適用して、機能をテストします。
- Look または Explore に移動します。
- Look の場合は、[Edit] をクリックして Look 編集します。
- ビジュアリゼーション タイプのメニューでその他メニューをクリックし、ビジュアリゼーションのプルダウン リストを開きます。
- 目的のカスタム ビジュアリゼーションを選択します。
- [Save] をクリックして、変更内容を Look に保存します。この変更の影響を受けるダッシュボードをメモします。
Looker には、Looker Marketplace で提供されているビジュアリゼーションの以下の機能が必要です。
関数 | 必須 |
---|---|
ビジュアリゼーションのドリルダウンのサポート | ○ |
Looker のカラーパレットを継承する機能 | ○ |
ブラウザと画面サイズに対する応答性 | ○ |
一貫性のあるフォント ファミリー: font-family 、Helvetica 、Arial 、sans-serif |
○ |
フォントサイズの設定 | ○ |
ビジュアリゼーション構成パネルで値ラベルと軸ラベルを切り替える機能 | ○ |
ピボットデータのビジュアリゼーション | あり(該当する場合) |
updateAsync 関数または is update を使用したユーザーのインタラクティブ性に基づくビジュアリゼーションの更新 |
○ |
明確なエラー メッセージ(例: このビジュアリゼーションには 1 つのディメンションと 2 つのメジャーが必要です) |
○ |
ビジュアリゼーション構成パネルのすべてのオプションが、ビジュアリゼーションに明らかな変更を加える | ○ |
フィールドの value 形式をデフォルトで使用する |
あり(該当する場合) |
クエリで結果が返されない場合にエラーがスローされる | ○ |
ビジュアリゼーションを送信して審査を受ける
ビジュアリゼーションを送信する準備が整ったら、Looker Marketplace へのコンテンツの送信の手順に沿って、ビジュアリゼーションの補足ドキュメントを作成し、Looker チームにビジュアリゼーションを送信して審査を受け、Looker Marketplace にビジュアリゼーションを公開します。