Looker のコンポーネント ライブラリを使用すると、React コンポーネントのインターフェースを介して、アプリケーションが Looker の設計要素、UI パターン、データのビジュアリゼーションを活用できます。コンポーネントの例としては、フォーム、ボタン、フィルタ入力、ページ分けコントロール、レイアウト、折れ線グラフ、棒グラフ、散布図グラフ、表などがあります。
価値創出までの時間の短縮は、コンポーネントの長所の 1 つですが、Looker とカスタム開発されたアプリケーションの間でよりシームレスなエクスペリエンスを実現することで真価が発揮されます。
一般的な使用例は次のとおり。
- Looker 拡張機能内でのページ ナビゲーションなどの Looker に似た UI の作成
- 埋め込み Looker コンテンツの周囲に、ダッシュボード フィルタなどの Looker に似た UI を作成する
- iframe 埋め込みの機能をまったく使用せずに、埋め込み分析アプリケーション内で軽量な個別ビジュアリゼーションを実現する
コンポーネントを使用する
React コンポーネントであるため、Looker コンポーネントは NPM に公開され、NPM を使用してフロントエンドの JavaScript または TypeScript アプリケーションに簡単に追加できます。
UI コンポーネント、フィルタ コンポーネント、可視化コンポーネントには、個別の NPM パッケージを利用できます。
試してみる
コードを記述する前に Looker コンポーネントの動作を確認したい場合。これらのデモとサンドボックスは、次のような場合に役立ちます。
- コンポーネントのインタラクティブ リファレンス: 可視化コンポーネント以外のすべての Looker コンポーネントのリスト
- 可視化コンポーネントのプレイグラウンド: 使用可能なビジュアリゼーション オプションからインタラクティブに選択して、プレイグラウンド アプリケーションでレンダリングされたビジュアリゼーションを表示します。埋め込みはありません
- Atom Fashion: Looker のコンポーネントを使用して構築されたデモ用のデータドリブン ウェブ アプリケーション（ログインには Google アカウントが必要です）
ご利用にあたって
Looker UI コンポーネントを使ってみる Looker コンポーネントを使ってみる Looker 可視化コンポーネントを使ってみる