埋め込み SDK
埋め込み SDK を使用してチャートやダッシュボードをウェブ アプリケーションに埋め込むと、設定とレンダリングをより柔軟に調整できるようになります。
詳しくは、「 埋め込み SDK を使い始める 」を参照してください。
埋め込み SDK のインストール
単純なウェブ アプリをお持ちの場合は、スクリプト タグから埋め込み SDK を参照できます。インストールは必要ありません。 UMDを使用して、ブラウザで直接 @mongodb-js/charts-embed-sdkを実行できます。
<script src="https://unpkg.com/@mongodb-js/charts-embed-dom"></script>
より複雑なウェブアプリを作成しており、 npmまたはyarnを使用している場合は、埋め込み SDK をインストールして、スクリプトファイルから直接使用できるようにできます。
npmを使用して埋め込み SDK をインストールするには、次のコマンドを使用します。
npm install @mongodb-js/charts-embed-dom
yarnを使用して をインストールする方法
yarn add @mongodb-js/charts-embed-dom
例
サンプルアプリ 埋め込み SDK を使用する方法については、codesandbox.io を参照してください。このサンプルアプリでは、インタラクティブ フィルターや手動更新ボタンなど、埋め込み SDK で利用できるインタラクティブ機能の一部が表示されます。
サンプル アプリは、アプリに固有のチャート ID とベース URL で構成されています。 必ず正しいチャート ID または ダッシュボード ID とベース URL を使用して独自のアプリを構成してください。
このサンプルアプリでは、次の 2 つの SDK メソッドを使用しています。
方式 | 説明 | args | 戻り値 |
|---|---|---|---|
refresh() | なし | Promise[vid]<void> | |
setFilter() | 指定された MQLフィルター ドキュメントに基づいて埋め込みチャートをフィルタリングします。 フィルターに含まれるフィールドは、埋め込みチャート モーダルで指定する必要があります。 「 SDK で埋め込みChartsをフィルタリングする 」を参照してください。 | フィルターオブジェクト | Promise[vid]<void> |
その他の例は、「MongoDB 埋め込み SDK の例 」Github を参照してください。 リポジトリ。