概要

Javascript APIの有効化

Javascript APIは、新規インストールされたバージョン5.1以降で有効化されています。古いバージョンからアップグレードをした場合は、Javascript APIを有効化する手順について、Yellowfinサポートに問い合わせをしてください。

Javascript APIの使用

HTMLページで、レポートやダッシュボードをロードする方法は二つあります。簡単な方法では、ひとつのJavascript URLを使用します。高度な方法では、レポートやダッシュボードの表示をカスタマイズすることができ、他のスクリプトから必要に応じて、コンテンツをロードすることができます。

基本的な使用

HTMLページに、Yellowfinサーバを指すスクリプトタグを含めます。レポートやダッシュボードの識別子を、URL上のパラメーターとして含めなくては行けません。

例：

<!-- report example -->
<script type="text/javascript" src="http://reporting.example.com/JsAPI?reportUUID=e5e5aaf3-c3b8-4f9b-8280-e21e4d848e63"></script>

<!-- dashboard example -->
<script type="text/javascript" src="http://reporting.example.com/JsAPI?dashUUID=3b0b6c9a-9dfb-41f0-b85a-eb17bb8aeeb9"></script>

APIへのURLは、YellowifnのフロントエンドにアクセスするURLを基にしています。例えば、ユーザー「http://reporting.example.com:8080/」を経由してアクセスをしている場合、Javascript API のURLは、「http://reporting.example.com/8080/JsAPI」となります。このURLは、エンドユーザーのブラウザを使用してアクセスされるため、エンドユーザーがページを使用するあらゆる場所（インターネットネットワーク、外部ネットワーク、VPN経由、など）からアクセスできるようにしなくてはいけません。

ページに記述したAPIのバージョンをサーバが確実にサポートするために、バージョンパラメーターを使用することができます。サーバが、複数のAPIバージョンをサポートする場合、このパラメーターは、サーバが使用するバージョンを決定します。サーバが要求されたバージョンをサポートしない場合は、エラーメッセージが表示されます。

<script src="http://localhost/JsAPI?version=2.1&reportUUID=e5e5aaf3-c3b8-4f9b-8280-e21e4d848e63" type="text/javascript"></script>

バージョンパラメーターが含まれていない場合、サーバは現在のバージョンを使用します。

レポートURLのパラメーター

レポートは、「reportUUID」パラメーターにより識別されます。下位互換性のために、「reportId」、または「wsName 」パラメーターにより識別されることもあります。URLに追加パラメーターを追加することもでき、これは、レポートの表示方法を変更します。使用可能なパラメーターは、以下の通りです。

こちらを展開する

パラメーター	説明
`reportUUID`	`reportUUID`、`reportId`、`wsName`のいずれかが、存在する必要があります。ロードするダッシュボードを識別する固有のIDです。
`reportId`	`reportUUID`、`reportId`、`wsName`のいずれかが、存在する必要があります。ロードするレポートを識別する数値reportIdです。代わりに`reportUUID`パラメーターを使用することをお勧めします。
`wsName`	`reportUUID`、`reportId`、`wsName`のいずれかが、存在する必要があります。ロードするレポートを識別するWebサービス名です。代わりに`reportUUID`パラメーターを使用することをお勧めします。
`version`	使用するAPIバージョンです。サーバーがリクエストされたバージョンをサポートしていない場合、エラーメッセージが表示されます。こちらのパラメーターが含まれていない場合、サーバーは現在のAPIバージョンを使用します。
`elementId`	レポートをロードするHTML要素のIDです。こちらのパラメーターが含まれていない場合、スクリプトタグが含まれる時点でコンテナー要素が作成されます。
`showTitle`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、レポート上部のタイトルバーが省略されます。タイトルバーに含まれるすべてのインタラクティブボタンも省略されます。
`showInfo`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーの情報ボタンが省略されます。
`showFilters`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーのフィルターボタンが省略されます。ユーザープロンプトフィルターは表示されません。
`showSections`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーのセクションボタンが省略されます（タブ形式、または複数ページのセクションを使用するレポートの場合）。
`showSeries`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーのシリーズボタンが省略されます（シリーズ選択オプションを使用するレポートの場合）。
`showPageLinks`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーの前のページ/次のページボタンが省略されます（複数ページを使用するレポートの場合）。
`showExport`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーのエクスポートボタンが省略されます。
`height`	レポートの高さを上書きするために、こちらに数値を設定します。
`width`	レポートの幅を上書きするために、こちらに数値を設定します。
`display`	デフォルトでは、「`chart」に設定されています。` `こちらを「table」`に設定すると、レポートの初期状態がテーブルで表示されます。 `こちらを「chart」`に設定すると、レポートの初期状態がグラフで表示されます。こちらの設定は、テーブルとグラフの両方が使用可能でないレポートでは無視されます。
`fitTableWidth`	デフォルトでは、「`true」に設定されています。` `こちらを「true」`に設定することで、レポートを囲み要素の幅に合わせようとします。
`canChangeDisplay`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、ユーザーがグラフ表示とテーブル表示を切り替えることができるボタンが省略されます。
`username`	こちらを「`password`パラメーター」と共に設定することで、レポートをロードするときの特定のユーザーとして認証されます。ユーザーは制限されているレポートを表示する前に、ログイン詳細を入力する必要がありません。
`password`	こちらを「`username`パラメーター」と共に設定することで、レポートをロードするときの特定のユーザーとして認証されます。
`token`	レポートをロードするときに、Webサービストークンを使用して、ユーザーが認証されます。

例

こちらの例には、レポートと、レポートのディメンション（次元）の設定が含まれます。

<script src="http://localhost/JsAPI?reportUUID=e5e5aaf3-c3b8-4f9b-8280-e21e4d848e63&width=500&height=350" type="text/javascript"></script>

こちらの例は、レポートの表示に既存の要素を使用し、ユーザー資格情報を渡します。

<div id="myReportDiv" style="background: blue; width: 500px; height: 350px">
<script src="http://localhost/JsAPI?reportUUID=e5e5aaf3-c3b8-4f9b-8280-e21e4d848e63&elementId=myReportDiv&username=admin@yellowfin.com.au&password=test" type="text/javascript"></script>
</div>

こちらの例は、レポートの表示に既存の要素を使用し、レポートディメンション（次元）を上書きし、初期表示オプションのいくつかを変更します。

<div id="myReportDiv" style="background: blue; width: 500px; height: 350px">
<script src="http://localhost/JsAPI?reportUUID=e5e5aaf3-c3b8-4f9b-8280-e21e4d848e63&elementId=myReportDiv&width=400&height=300&showFilters=false&display=table" type="text/javascript"></script>
</div>

ダッシュボードURLのパラメーター

ダッシュボードは、「dashUUID」を使用して識別されます。追加URLを追加することができ、これは、ダッシュボードの表示方法を変更します。使用可能なパラメーターは、以下の通りです。

こちらを展開する

パラメーター	説明
`dashUUID`	必ず存在する必要があります。ロードするダッシュボードを識別する固有のIDです。
`version`	使用するAPIバージョンです。サーバーがリクエストされたバージョンをサポートしていない場合、エラーメッセージが表示されます。こちらのパラメーターが含まれていない場合、サーバーは現在のAPIバージョンを使用します。
`elementId`	ダッシュボードをロードするHTML要素のIDです。こちらのパラメーターが含まれていない場合、スクリプトタグが含まれる時点でコンテナー要素が作成されます。
`showTitle`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、レポート上部のタイトルバーが省略されます。タイトルバーに含まれるすべてのインタラクティブボタンも省略されます。
`showInfo`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーの情報ボタンが省略されます。
`showFilters`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーのフィルターボタンが省略されます。分析フィルターは表示されません。
`showExport`	デフォルトでは、「`true」に設定されています。` `こちらを「false」`に設定することで、タイトルバーのエクスポートボタンが省略されます。
`height`	ダッシュボードの高さを上書きするために、こちらに数値を設定します。こちらを指定しない場合、ダッシュボードの高さは、スクロールをしなくてもすべてのレポートが表示されるのに十分な大きさに設定されます。
`width`	ダッシュボードの幅を上書きするために、こちらに数値を設定します。 `こちらを「auto」`に設定すると、親要素に合わせて拡大します。こちらを指定しない場合、ダッシュボードの幅は、ログインユーザーの設定、またはシステム構成設定に基づいて設定されます。
`username`	こちらを「`password`パラメーター」と共に設定することで、ダッシュボードをロードするときの特定のユーザーとして認証されます。ユーザーは制限されているダッシュボードを表示する前に、ログイン詳細を入力する必要がありません。
`password`	こちらを「`username`パラメーター」と共に設定することで、ダッシュボードをロードするときの特定のユーザーとして認証されます。
`token`	ダッシュボードをロードするときに、Webサービストークンを使用して、ユーザーが認証されます。

例

こちらの例には、ダッシュボードと、ダッシュボードのディメンション（次元）の設定が含まれます。

<script src="http://localhost/JsAPI?dashUUID=3b0b6c9a-9dfb-41f0-b85a-eb17bb8aeeb9&width=auto&height=500" type="text/javascript"></script>

こちらの例は、レポートの表示に既存の要素を使用し、ユーザー資格情報を渡します。

<div id="myDashDiv" style="background: blue; width: 900px; height: 500px">
<script src="http://localhost/JsAPI?dashUUID=3b0b6c9a-9dfb-41f0-b85a-eb17bb8aeeb9&elementId=myDashDiv&username=admin@yellowfin.com.au&password=test" type="text/javascript"></script>
</div>

こちらの例は、レポートの表示に既存の要素を使用し、レポートディメンション（次元）を上書きし、初期表示オプションのいくつかを変更します。

<div id="myDashDiv" style="background: blue; width: 900px; height: 500px">
<script src="http://localhost/JsAPI?dashUUID=3b0b6c9a-9dfb-41f0-b85a-eb17bb8aeeb9&elementId=myDashDiv&width=800&height=400&showFilters=false" type="text/javascript"></script>
</div>