メインコンテンツまでスキップ
バージョン: 2.0

インストール

ベータ版の製品

Reveal SDK の Web Component ラッパーは現在開発中です。最終リリースに向けて改善を重ねておりますので、ぜひご意見・ご要望をお寄せください。

ラッパーに関するドキュメントも現在作成中ですが、完成を待たずに皆さまに共有させていただいています。

Reveal SDK Web Component ラッパーをプロジェクトに統合するのは簡単です。シンプルなセットアップのために CDN を使用する場合でも、npm 経由でローカルにインストールする場合でも、ニーズに応じた方法をご用意しています。React、Vue、Angular など特定のフレームワークを使用している場合は、それぞれの統合ガイドをご参照ください。

前提条件

Reveal SDK Web Component ラッパーは reveal-sdk をピア依存関係として宣言しているため、ラッパーと一緒に Reveal SDK クライアントをインストールする必要があります。利用可能なインストール方法については、クライアント SDK のインストールを参照してください。

CDN のインストール

もっとも簡単な導入方法として、CDN を使用することができます。最初に Reveal SDK クライアントを読み込み、次にラッパーを読み込みます。

<script src="https://cdn.jsdelivr.net/npm/reveal-sdk/dist/reveal-sdk.js"></script>
<script src="https://cdn.jsdelivr.net/npm/reveal-sdk-wrappers/index.umd.min.js"></script>
<script>
// Change to your Reveal SDK server URL
Reveal.RevealSdkSettings.setBaseUrl("https://samples.revealbi.io/upmedia-backend/reveal-api/");
</script>

NPM のインストール

ローカルでのインストールやバージョン管理を行いたい場合は、npm 経由で両方のパッケージをインストールできます。reveal-sdk はラッパーのピア依存関係であるため、明示的にインストールする必要があります。

手順 1: パッケージのインストール

Reveal SDK クライアントと Web Component ラッパーをインストールするには、プロジェクト ディレクトリで次のコマンドを実行します。

npm install reveal-sdk reveal-sdk-wrappers

手順 2: コンポーネントの登録

インストール後、Web Components をアプリケーションに登録する必要があります。デフォルトでは、すべての Reveal SDK Web Component ラッパーがグローバルに登録され、個別のインポートなしに使用できます。

import { defineRevealSdkWrappers } from "reveal-sdk-wrappers";
defineRevealSdkWrappers();

手順 3: バンドル サイズの最適化 (オプション)

特定のコンポーネントのみをインポートしてバンドル サイズを最適化したい場合は、必要に応じて個々のコンポーネントを登録できます。

import { defineRevealSdkWrappers, RvRevealView } from "reveal-sdk-wrappers";
defineRevealSdkWrappers(RvRevealView);

コンポーネントの追加

rv-reveal-view コンポーネントの使用を開始するには、これを HTML に含めます。

<rv-reveal-view></rv-reveal-view>

以上の手順に従うことで、Reveal SDK Web Component ラッパーをプロジェクトに統合し、強力なデータ可視化やインタラクティブなダッシュボード機能をすぐに利用できるようになります。SDK の豊富なコンポーネントやカスタマイズ オプションを活用して、ユーザーにとって魅力的でシームレスな体験を提供しましょう。