---
sourceDocument: Xanadu プラットフォームアナリティクス
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ja-JP/xanadu/now-intelligence

 Release :

    - xanadu

ft:locale :

    - ja-JP

ft:publication_title :

    - Xanadu プラットフォームアナリティクス

ft:clusterId :

    - par

bundleId :

    - par

workflow :

    - Platform


---

# データの可視化でのローカルデータインスタンスの使用

# データの可視化でのローカルデータインスタンスの使用 {#ariaid-title1}

* リリースバージョン: Xanadu
* 
* 更新日 2024年08月01日
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 所要時間：5分

事前設定されたデータソースよりもきめ細かくデータソースを制御するには、ローカルデータインスタンスを作成します。次に、ローカルデータインスタンスをデータ可視化の dataPassthrough プロパティにバインドします。

## 始める前に

重要:  
これは高度な手順です。ローカルデータインスタンスが必要かどうか、または標準データソースを使用できるかどうかを慎重に検討してください。

先に進む前に、 [Dynamically expose data in UI Builder pages (advanced feature)](https://www.servicenow.com/docs/access?context=data-resources&version=xanadu&pubname=xanadu-application-development&ft:locale=en-US)を確認してください。

必要なロール：ui_builder_admin、admin

## 手順

1. UI ビルダーでテクニカルダッシュボードまたはその他のUI ビルダーページを開きます。
2. \[データとスクリプト\] ドロワーの \[データ リソース\] で、 \[ + データ リソースの追加\] を選択します。  

   ![データリソースがまだない場合は、データリソースリンクを追加します。]()  
3. \[Select a data resource (データリソースを選択)\] ウィンドウで、「Data visualization ( <kbd class="ph userinput">データの可視化</kbd>)」を検索します。  
   使用できるデータリソースを選択できます。  

4. 表示するデータのタイプに一致するデータリソースを選択します。
5. 情報ペインを読み、構成の詳細をコピーまたはメモします。
6. \[Add (追加)\] を選択します。
7. このデータインスタンスを使用する予定の可視化のタイプに必要な構成オプションを入力します。  
   同じデータを使用するすべてのタイプの可視化に対して、個別のローカルデータインスタンスを作成して構成します。たとえば、同じインジケーターのスコアを表示する棒グラフと時系列を作成する場合は、棒グラフと時系列の可視化用にそれぞれ 1 つずつ、両方とも同じインジケーター上に、合計 2 つのローカルデータインスタンスを作成します。  
   ヒント:  
   データの可視化をページに追加し、その構成パネルをローカルデータインスタンスのオプションと比較できます。
8. このデータソースの `@data` データバインドをコピーします。  

   <br />

9. 目的のデータ可視化コンポーネントをページに追加します。
10. そのデータ可視化の構成パネルの \[データソース\] セクションで、\[ データを手動で定義\] をオンにします。
11. \[データ\] フィールドで、\[データをバインドするかスクリプトを使用\] を選択します。  

    <br />

12. \[データをデータにバインド\] ダイアログの \[データ型\] で、\[ データ リソース\] を選択します。
13. \[Add a data output to this area\] (この領域にデータ出力を追加) セクションをダブルクリックし、ローカルデータインスタンスへのデータバインドを青いボックスに貼り付けます。
14. データバインドの末尾に <kbd class="ph userinput">.output.result</kbd> を追加します。  
    たとえば、ローカルデータインスタンスdata_visualization_api_for_table_data_source_1への完了したデータバインドは `@data.data_visualization_api_for_table_data_source_1.output.result` です。  

15. \[適用\] を選択します。

## タスクの結果

ローカルデータインスタンスを作成し、データの可視化にバインドしました。これで、データの可視化の構成を完了できます。

## ローカルデータインスタンスに適用するフィルターの有効化 {#ariaid-title2}

データの可視化に表示されるフィールド値またはブレークダウン要素をビューアーが切り替えられるようにするには、 UI ビルダー ページにフィルターコンポーネントを追加します。これらのフィルターをローカルデータインスタンスに適用するには、そのインスタンスを適宜設定します。

### 始める前に

必要なロール：ui_builder_admin、admin

### このタスクについて

フィルターをローカルデータソースに適用できるようにするには、まず `parFilters` という名前のクライアントステータスパラメーターを作成してから、そのステータスパラメーターをローカルデータインスタンスに追加する必要があります。

### 手順

1. フィルタリングするローカルデータインスタンスとデータの可視化を含む UI ビルダー ページを開きます。
2. \[データとスクリプト\] ドロワーで、 \[ クライアントステータスパラメーター\] を選択します。
3. \[+ 追加\] を選択します。
4. \[クライアント状態パラメーターの編集\] ダイアログで、新しいパラメーターに <kbd class="ph userinput">「parFilters</kbd>」という名前を付け、JSON 型を割り当てて、{ <kbd class="ph userinput">}</kbd> の初期値を設定します。  

   ![\[クライアントステータスパラメーターの編集 (Edit client state parameters)\] ダイアログの parFilters クライアントステータスパラメーター。]()  
5. \[クライアントステータスパラメーターの編集\] ダイアログを閉じます。
6. (データとスクリプト) ドロワーの \[Data resources (データリソース)\] で、目的のローカルデータインスタンスを選択します。
7. \[Edit \<name of local data instance\> ダイアログで、\[ Filter configurations \] フィールドまで下にスクロールします。
8. \[フィルター構成\] フィールドに「<kbd class="ph userinput">@state.parFilters</kbd>」と入力し、データインスタンスエディターを閉じます。
9. このローカルデータリソースを使用するデータ可視化の構成パネルで、\[データ更新\] セクションの \[フィルターに従う \] をオンにします。
10. **オプション:** \[ フィルターを表示\] アイコンをオンにします。
11. UI ビルダーページを保存します。

### 次のタスク

フィルターコンポーネントを UI ビルダー ページに追加し、ローカルデータインスタンスの関連する値に対して構成します。
**関連概念**   

* [のフィルター プラットフォームアナリティクス](https://servicenow-prod.fluidtopics.net/l5_xDUno3etGDXSf7jLGXg "可能なデータ値、値の true/false、または日付によって、ダッシュボードのリストとデータの可視化をフィルター処理します。 フィルターは、フィルターの配置に応じて、同じダッシュボードまたは同じダッシュボード タブ上のすべての要素に適用されます。")

## ローカルデータインスタンスのデータキャッシュを有効にする {#ariaid-title3}

データの可視化のロード時間を短縮し、リアルタイムまたは非常に新しいデータが必要ない場合は、データソースでデータキャッシュを有効にします。

### 始める前に

必要なロール：ui_builder_admin、admin

### 手順

1. データをキャッシュするローカルデータインスタンスを含む UI ビルダー ページを開きます。
2. (データとスクリプト) ドロワーの \[Data resources (データリソース)\] で、目的のローカルデータインスタンスを選択します。
3. \[ データキャッシュを使用 \]まで下にスクロールしてオンにします。  
   このデータソースを使用するデータの可視化では、データソースのキャッシュ設定が使用されます。可視化自体のデータキャッシュ設定は、構成パネルから削除されます。
4. 必要に応じて、他のキャッシュプロパティを設定します。  
   {#enable-caching-local-data-instance__table_k5f_bng_2bc__entry__2}

   | プロパティ | Description (説明) |
   |-|-|
   | キャッシュ有効期限 | 一度作成されたキャッシュが、キャッシュ更新ジョブで更新されるまで保持される期間。 |
   | キャッシュを無効にする | この設定は、キャッシュを無効にして新しいデータをフェッチするために作成する追加のロジックとともに使用します。たとえば、ボタンコンポーネントをページに追加し、そのイベントハンドラーをスクリプト化してキャッシュを無効にすることができます。 |
   | 追加キー | このデータインスタンスに作成された各データキャッシュの一意のハッシュキーの生成に寄与する文字列を入力します。ローカルデータインスタンスごとに一意の追加キー値を使用します。 |
   [ ]

   {#enable-caching-local-data-instance__table_k5f_bng_2bc}