Page History
| Anchor | ||||
|---|---|---|---|---|
|
| Table of Contents | ||
|---|---|---|
|
ダッシュボードの構造
ダッシュボードは、（サブタブとして知られる）ひとつ以上のページの集合です。サブタブはエンティティの集合です。ダッシュボード内のコンテキストのエンティティは、サブタブに配置されるものです。これはレポートやフィルター一覧、キャンバスに配置される任意のオブジェクト（図形、テキスト、ボタン、イメージなど）です。
そのため、ダッシュボードの基礎的な構造は以下のようになります。
- ダッシュボード
- サブタブ
- サブタブのエンティティ（レポート、キャンバスなど）
- グローバルコンテンツエンティティ（フィルターパネル）
- フィルターAPI
- サブタブ
サブタブ、レポート、フィルターには数多くの固有のプロパティがあり、リファレンスガイドでこれを確認できます。
エンティティとは何か
前述したように、ダッシュボード内のコンテキストのエンティティは、サブタブに配置されるものです。これはレポートやフィルター一覧、キャンバスに配置される任意のオブジェクト（図形、テキストなど）です。
ダッシュボードの作成中に、エンティティがダッシュボードに追加されると、固有の識別子が割り当てられます。これは、ダッシュボード API内でダッシュボードのエンティティに内部的に使用される識別子です。
レポートでは、この固有IDを使用することで、ダッシュボードに同じレポートを複数追加し、異なるフィルターを適用できるため非常に重要です。これがなければ、同じレポートの2つのバージョンがあった場合に、フィルターの適用、またはレポートのドリル時に、どちらのレポートを参照すればよいのか分かりません。
フィルターパネルおよびフィルター API
ダッシュボード上のフィルター APIには、ダッシュボード上で有効化されたすべてのユーザープロンプトフィルターが含まれます。これには、現在表示されていないフィルターも含まれます。
フィルターパネルは、エンドユーザーに表示されるものです。これはフィルター API内のフィルターオブジェクトを使用して、ユーザーに表示されるものを生成します。
DOM操作を使用することなく、フィルターパネルを操作することはできません。しかし開発者は、フィルター APIを通して、これらのパネル内でフィルターを操作することができます。
レポートのリファレンス
getAllReports()関数を使用することで、すべてのレポートとそのエンティティIDを確認することができます。これは、以下を含むオブジェクトの配列を返します。
- レポートUUID - これはレポートの公開UUIDです。これは、同じレポートが複数追加されている場合、ダッシュボードで一意ではないことがあります。
- エンティティUUID - ダッシュボード上のアイテムに固有のIDです。
- サブタブUUID - レポートが追加されたサブタブのUUIDです。
- サブタブId - レポートが追加されたサブタブの内部IDです。
これらすべてのレポートは、サブタブが表示されると、ダッシュボードにより自動的にロードされます。
ダッシュボードおよびプレゼンテーション
Yellowfin プレゼントは、Yellowfin ダッシュボードから構築されています。そのため、ダッシュボード APIのすべての関数は、プレゼンテーションに適用しても機能します。プレゼンテーションの使用中に次のスライドへ移動する場合は、「nextSubTab()」関数を呼び出すか、五番目のスライドへ移動する場合は、moveToTabAtPosition(4)を使用します。
プロパティリファレンス
UUid
リターン
String
説明
ダッシュボードのUUIDを返します。
filters（フィルター）
リターン
説明
ダッシュボードのフィルター APIを返します。
name（名前）
リターン
String
説明
ダッシュボード名を返します。これは、翻訳が有効化され、その言語の翻訳が提供されている場合、ユーザーの使用言語に翻訳されます。
description（説明）
リターン
String
説明
ダッシュボードの説明を返します。これは、翻訳が有効化され、その言語の翻訳が提供されている場合、ユーザーの使用言語に翻訳されます。
currentSubTabId（現在のサブタブID）
リターン
Number
説明
ユーザーが現在閲覧しているサブタブのサブタブIDを返します。
runUrl（URLの実行）
リターン
String
説明
このダッシュボードへの直接リンクを返します。例：
これは、このダッシュボードに直接アクセスするシンプルなリンクであり、フィルターは含まれていません。
externalApiUrl（外部APIのURL）
このダッシュボードへの直接埋め込みリンクを返します。例：
| <script type="text/javascript" src="http://localhost:8080/JsAPI/v3?dashUUID=1e68d9cc-fa5a-44e2-816d-782aa40ceeae"></script> |
関数のリファレンス
loadReport(options)（レポートのロード）
リターン
Promise
説明
ダッシュボードのコンテキスト内にレポートをロードします。promiseを解決して、レポートオブジェクトにパラメーターとして渡しますが、自動的には表示されません。
レポートUUID/エンティティUUIDの組み合わせが既にダッシュボードにロードされている場合は、関連するレポートオブジェクトでpromiseを即座に解決します。
レポートがダッシュボードの一部として設定され、フィルターリンクやインタラクションリンクが適用されている場合は、これらのリンクを自動的に適用します。
レポートがダッシュボードに関連していない場合は、ロードされますが、自動的にフィルターを使用することができません。
パラメーター
Options - Object
次を含めなくてはいけません。
- ReportId - (String) ロードするレポートのレポートUUID、または公開UUIDです。
- EntityUUID - このインスタンスのレポートに固有のIDです。
getCurrentSubTub()（現在のサブタブを取得）
リターン
説明
現在選択されているタブのサブタブオブジェクトを返します。ダッシュボードに現在選択されているサブタブが無い場合は（これは、最初のロード時に時たま起こります）、最初のサブタブが返されます。
例
| let subTab = dashboard.getCurrentSubTab(); console.log(subTab.name); |
getSubTubByPosition(position)（位置を使用してサブタブを取得）
リターン
説明
渡された位置のサブタブオブジェクトを返します。この位置は0から始まります。
位置の値がタブの数と異なる場合は、nullが返されます。
パラメーター
position: Number
例
四番目のサブタブを取得し、これを検証して、その名前を表示します。
| let subTab = getSubTabByPosition(4); if(subTab) { console.log(subTab.name); } |
getSubTab(subTabId)（サブタブの取得）
リターン
説明
渡されたサブタブIDのサブタブオブジェクトを返します。サブタブ名が渡された場合は、対応するタブIDへの変換を試みます。
一致するIDが見つからない場合は、nullが返されます。
パラメーター
subTabId: String
例
| //Get sub tab by Id let subTab = dashboard.getSubTab(123456); //Get subTab by name let subTab = dashboard.getSubTab('Campaign Summary'); |
nextSubTab()（次のサブタブ）
リターン
なし
説明
ダッシュボードの現在のタブを、順番に次のタブへ変更します。ユーザーの観点から、これは現在のタブの右のタブへ移動します。
ダッシュボードが現在最後のタブを表示している場合は、最初のタブに移動します。
例
「次へ」ボタンをクリックした後に、新しいタブへ移動します。
| document.querySelector('div#nextTabButton').addEventListener('click', function(e) { dashboard.nextSubTab(); }); |
10秒ごとに新しいタブへと移動します。
| setInterval(function() { dashboard.nextSubTab(); }, 10000); |
previousSubTab()（前のサブタブ）
リターン
なし
説明
ダッシュボードの現在のタブを、順番に前のタブへ変更します。ユーザーの観点から、これは現在のタブの左のタブへ移動します。
ダッシュボードが現在最初のタブを表示している場合は、最後のタブに移動します。
例
「前へ」ボタンをクリックした後に、新しいタブへ移動します。
| document.querySelector('div#previousTabButton').addEventListener('click', function(e) { dashboard.previousSubTab(); }); |
10秒ごとに新しいタブへと移動します。
| setInterval(function() { dashboard.previousSubTab(); }, 10000); |
findSubTabOrder(subTabId)（サブタブの順番の検索）
リターン
Number
説明
サブタブの位置を返します。一致するサブタブが無い場合は、nullが返されます。ソートインデックスは、0から始まります。
パラメーター
subTabId: Number, String
位置を検索したいサブタブのID、または名前です。
例
名前を使用してサブタブの位置を取得します。
| let subTabPosition = dashboard.findSubTabOrder('Campaign Summary') |
IDを使用してサブタブの位置を取得します。
| let subTabPosition = dashboard.findSubTabOrder(123456); |
moveToTab(subTabId)（タブへ移動）
リターン
なし
説明
ダッシュボードの現在のタブを、渡されたIDと一致するサブタブへ移動します。名前が渡された場合は、一致するIDへの変換を試みます。一致するタブが無い場合は、何も起きません。
タブが変更されたら、ダッシュボード APIによりtabChanged（タブ変更）イベントが発生します。
パラメーター
subTabId: String
移動するサブタブのUUID、または名前です。
例
「Campaign Summary」タブへ移動します。
| dashboard.moveToTab('Campaign Summary'); |
UUID「28c595a5-c097-445c-ac9d-cbd4c415a667」を使用してタブへ移動します。
dashboard.moveToTab(‘28c595a5-c097-445c-ac9d-cbd4c415a667’); |
moveToTabAtPosition(position)（特定の位置のサブタブへ移動）
リターン
なし
説明
ダッシュボードの現在のサブタブを一致する位置のサブタブへ変更します。一致するタブが無い場合は、何も起きません。サブタブ位置が指定可能な範囲に含まれない場合は（例：ダッシュボード上のサブタブ数）、何も起きません。
タブが変更されたら、ダッシュボード APIによるtabChanged（タブ変更）イベントが発生します。
パラメーター
position: Number
移動するタブの並び順です。ソートインデックスは、0から始まります。
例
最初のサブタブへ移動します。
| dashboard.moveToTabAtPosition(0); |
最後のサブタブへ移動します。
| dashboard.moveToTabAtPosition(dashboard.getSubtabs().length - 1); |
hasFilters()（フィルターを持つ）
リターン
Boolean
説明
ダッシュボードが有効化されたユーザープロンプトフィルターを持つ場合は、trueを返します。持たない場合は、falseを返します。
例
| let hasFilters = dashboard.hasFilters(); if(hasFilters) { console.log("this dashboard has modifiable filters"); } |
refresh()（更新）
リターン
なし
説明
ダッシュボード上のすべてのレポートを再実行します。これにより、すべてのレポートがサーバから新しいデータセットを取得します。
これは、ライブデータを使用して作業をしているときに、ページからのアクションにより、一部のレポートの背後にあるデータセットが更新される場合に有効です。
これを使用して、同じフィルターセットでレポートを再実行できます。
例
| dashboard.refresh(); |
resetDashboard()（ダッシュボードのリセット）
リターン
なし
説明
ダッシュボード上のすべてのレポートをリセットしてデフォルトの状態に戻し、すべてのフィルターをデフォルト値に戻します。
これは、レポートに適用されたすべてのブラッシングやドリル機能、フィルターリンクをリセットします。
現在のタブ上のレポートのみが再実行されます。
getToReport(repotUUID)（レポートの取得）
リターン
なし
説明
渡されたレポートUUIDに関連するレポートの出力ページへブラウザを移動します。レポートが見つからない場合は、「Report Can't be Found（レポートは見つかりませんでした）」ページが表示されます。
パラメーター
reportUUID: String
移動するレポートの公開UUIDです。
制限
これは、ダッシュボードコードモード内でのみ機能します。
getEmbedURL()（埋め込みリンクの取得）
リターン
String
説明
ダッシュボードの埋め込みリンクを現在の状態で正確に取得します。URLには、適用されたフィルターやブックマークが含まれます。
これは、ダッシュボードの基本状態（例：フィルター、またはブックマークのリファレンスを含まない）でのリンクを含むexternalApiUrl プロパティとは異なります。
getSubTabs()（サブタブの取得）
リターン
Array[SubTab]
説明
ダッシュボードに関連づけられているすべてのサブタブを配列で返します。
例
すべてのサブタブ名とUUIDを順番に出力します。
| let subTabs = dashboard.getSubTabs(); subTabs.forEach(subTab => { console.log(subTab.name + " : " + subTab.uuid); }); |
getAllReports()（すべてのレポートの取得）
リターン
Array[Object]
説明
レポートUUID、ダッシュボードに割り当てられたエンティティUUID、およびレポートが配置されたサブタブを含むオブジェクトの配列を返します。
ダッシュボード上にレポートが無い場合は、空の配列が返されます。
例
この関数を使用することで、ダッシュボード上にある特定のレポートのすべてのインスタンスを検索できます。
| let reportToFind = 'af67e527-81d3-47fc-81ce-dfc506a61dd2'; let dashboardReports = dashboard.getAllReports(); let dashboardReport= dashboardReports.find(reportInfo => { return reportInfo.reportUUID === reportToFind; }); if(dashboardReport) { //We found that report now we can load the report object. If the report has already been loaded by the dashboard this will just give us that version of the report dashboard.loadReport({ reportId: reportInfo.reportUUID, entityUUID: reportInfo.entityUUID }).then(report => { //Now we've fetched the report. }); } |
forEach(fn)
リターン
なし
説明
ダッシュボードに含まれるすべてのサブタブを順番に繰り返します。この関数には、反復ごとにサブタブオブジェクトが渡されます。
例
ダッシュボード上のすべてのサブタブの名前およびUUIDを出力します。
| dashboard.forEach(subTab => { console.log(subTab.name + " : " + subTab.uuid); }); |
イベントのリファレンス
tabChanged（タブの変更）
説明
現在のサブタブ、またはスライドが変更されるたびに呼び出されます。
パラメーター
イベント
以下を含みます。
- currentSubTab：（SubTab）ちょうど移動をしたサブタブです。
- currentSubTabId：（Number）現在のサブタブのIDです。
- previousSubTabId：（Number）ちょうど離れたサブタブのIDです。
例
| dashboard.addEventListener('tabChanged', function(event) { let newTab = event.currentSubTab; console.log('We have just moved to the ' + newTab.name + ' tab'); }); |
| dashboard.addEventListener('tabChanged', function(event) { let lastTab = dashboards.getSubTab(event.previousSubTabId); console.log('Moved from ' + lastTab.name); }) |
| horizontalrule |
|---|
| Styleclass | ||
|---|---|---|
| ||