---
schema_version: "1"
id: f6bb4035c9bc751fe6451ee1d56ea983fb429a934f157d2edddf466af3f10b72
title: カスタムダッシュボードおよびチャートの設定
collection: mulesoft
version: current
locale: ja-jp
portal_url: https://docs.salesforce.com/mulesoft/current/ja-jp/monitoring/dashboard-custom-config.md
canonical_url: https://docs.mulesoft.com/jp/monitoring/dashboard-custom-config
source_site: docs.mulesoft.com
content_type: documentation
content_hash: c81db5c361e04e527451fd48d7d10c76b0913cfe55637d2d459410be475b26db
description: MuleSoft Documentation Site
latest: true
---
# カスタムダッシュボードおよびチャートの設定

[![](/mulesoft/current/ja-jp/_/img/icons/info.svg)](/jp/monitoring/#billing)

カスタムダッシュボードは必要な数だけ作成して設定できます。

- カスタムダッシュボードを作成したら、ダッシュボードレベルのプロパティ (ダッシュボード名、タグ、タイムゾーン、メタデータなど) を設定できます。​[「ダッシュボードレベルの設定の実行」](#config_dashboard)​を参照してください。
- ダッシュボードの各行にデータを表示するためのチャート (ウィジェットとも呼ばれる) を 1 つ以上設定できます。
    
    ![カスタムダッシュボードのウィジェット](/mulesoft/current/ja-jp/monitoring/_images/dashboard-custom-widgets.png)
- **Graph (グラフ)**​: 多種多様なメトリクスを時系列データとして表示できます。Graph (グラフ) では、表示するデータを特定できるクエリ言語をサポートします。
    
    ![\[Graph (グラフ)\] の例](_images/dashboard-graph.png)
    
    Figure 1. 例: Graph (グラフ)
- **Singlestat (シングルスタット)**​: 時系列データの 1 グルーピングに関する概要統計 (1 つの合計または数値) を提供します。たとえば、応答時間やヒープ使用統計などの統計があります。
    
    ![\[Singlestat\] の例](_images/dashboard-singlestat.png)
    
    Figure 2. 例: Singlestat (シングルスタット)
- **Table (テーブル)**​: 表形式の時系列データをサポートします。セルの色指定と日付および値の書式設定ができます。
    
    ![\[Table (テーブル)\] の例](_images/dashboard-table.png)
    
    Figure 3. 例: Table (テーブル)
- **Text (テキスト)**​: ダッシュボードの行またはセル内で、マークダウンまたは HTML で記述されたテキスト情報 (タイトルと説明) の領域を使用できます。たとえば、ダッシュボードのヘッダーとして使用できます。
    
    ![\[Text (テキスト)\] チャートの例](_images/dashboard-text-header.png)
    
    Figure 4. 例: ダッシュボードヘッダーとしての Text (テキスト) ウィジェット

[「カスタムダッシュボードへのチャートの追加」](#charts_adding)​を参照してください。

<table><tbody><tr><td class="icon"><i class="fa icon-note" title="Note"></i></td><td class="content">カスタムダッシュボードパネルあたりのクエリ数には、25 個のハード制限があります。</td></tr></tbody></table>

## [](#config_dashboard)ダッシュボードの設定

カスタムダッシュボードのダッシュボードレベルの設定を実行するには、カスタムダッシュボードに移動し、ページ上部にある​[鉛筆アイコン (ダッシュボード名の横)](#dashboard_config)​ をクリックします。次の設定があります。

- [\[General (一般)\]](#dashboard_general)​ ダッシュボードプロパティ
- ダッシュボードのチャートの ​[\[Rows (行)\]](#dashboard_rows)
- [\[Metadata (メタデータ)\]](#dashboard_metadata)​ (表示のみ)

### [](#dashboard_general)\[General (一般)\] ダッシュボードプロパティの設定

![ダッシュボード設定の例](/mulesoft/current/ja-jp/monitoring/_images/dashboard-custom-config-high-level.png)

<table class="tableblock frame-all grid-all stretch">
<colgroup>
<col style="width: 20%;">
<col style="width: 80%;">
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top" colspan="2">[General (一般)] ダッシュボード設定</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Name (名前)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードの名前。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">説明</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">[i] アイコンでエンドユーザーが表示できる説明。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Tags (タグ)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">カスタムダッシュボードリストでダッシュボードを見つけるのに役立つ短い識別子。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Timezone (タイムゾーン)</p></td>
<td class="tableblock halign-left valign-top"><div class="content"><div class="paragraph">
<p>ほとんどのグラフが経時的なデータを追跡しているため、時間オプションは重要です。オプションは次のとおりです。</p>
</div>
<div class="ulist">
<ul>
<li>
<p><strong>Local Browser Time (ローカルブラウザー時刻)</strong>​: ブラウザーを実行中のコンピューターのシステム時間から取得された時刻。</p>
</li>
<li>
<p><strong>UTC</strong>​: 協定世界時標準。24 時周期 (​<code>19:20</code>​ など) と対応する GMT を使用します。</p>
</li>
</ul>
</div></div></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Graph Tooltip (グラフのツールチップ)</p></td>
<td class="tableblock halign-left valign-top"><div class="content"><div class="paragraph">
<p>次のオプションがあります。
* <strong>Default (デフォルト)</strong>​: 十字線カーソルがカーソルを置いたチャートにのみ表示されます。
* <strong>Shared Crosshair (共有十字線)</strong>​: 十字線がすべてのチャートに表示されます。
* <strong>Shared Tooltip (共有ツールチップ)</strong>​: 十字線とツールチップがすべてのチャートに表示されます。</p>
</div></div></td>
</tr>
</tbody>
</table>

### [](#dashboard_rows)カスタムダッシュボードの行の設定

**\[Row (行)\]**​ タブを使用して、おおまかなカスタムダッシュボード設定 (行のタイトル入力、ダッシュボード内での行の上下移動、行の削除) を行います。

![ダッシュボードの行設定](/mulesoft/current/ja-jp/monitoring/_images/dashboard-custom-config-rows.png)

<table class="tableblock frame-all grid-all stretch">
<colgroup>
<col style="width: 20%;">
<col style="width: 80%;">
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top" colspan="2">カスタムダッシュボードの行設定オプション</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Title (タイトル)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">行のタイトル。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Show Title (タイトルを表示)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">タイトルをエンドユーザーに表示します。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">上矢印アイコン</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードに複数行がある場合、ダッシュボード内で行を上に移動します。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">下矢印アイコン</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードに複数行がある場合、行を下に移動します。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">ごみ箱アイコン</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">行とそこに含まれるすべてのチャートをダッシュボードから削除します。</p></td>
</tr>
</tbody>
</table>

### [](#dashboard_metadata)カスタムダッシュボードのメトリクスの表示

**\[Metadata (メタデータ)\]**​ タブを使用して、カスタムダッシュボードにメトリクスを表示するためのおおまかなカスタムダッシュボード設定を行います。

![ダッシュボードのメタデータ](/mulesoft/current/ja-jp/monitoring/_images/dashboard-custom-metadata.png)

<table class="tableblock frame-all grid-all stretch">
<colgroup>
<col style="width: 20%;">
<col style="width: 80%;">
</colgroup>
<thead>
<tr>
<th class="tableblock halign-left valign-top" colspan="2">カスタムダッシュボードで使用可能なメタデータ</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Last Updated At (最終更新日時)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードが最後に更新された日時。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Last Updated By (最終更新者)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">最後に更新したユーザー。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Created At (作成日時)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードが作成された日時。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Created By (作成者)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードを作成したユーザーのユーザー名。</p></td>
</tr>
<tr>
<td class="tableblock halign-left valign-top"><p class="tableblock">Current Version (現在のバージョン)</p></td>
<td class="tableblock halign-left valign-top"><p class="tableblock">ダッシュボードのバージョン番号。バージョンは、ダッシュボードに変更を保存するたびに増分されます。</p></td>
</tr>
</tbody>
</table>

## [](#charts_adding)カスタムダッシュボードへのチャートの追加

1. **\[Anypoint Monitoring\]**​ のサイドバーから ​**\[Custom dashboards (カスタムダッシュボード)\]**​ をクリックします。
    
    - カスタムダッシュボードを作成するには、​**\[New Dashboard ( 新規ダッシュボード)\]**​ をクリックします。
    - チャートの新しい行が必要な場合、スクロールダウンして ​**\[Add Row (行を追加)\]**​ を見つけてクリックします。
2. チャートを行に追加するには、​**\[Add (追加)\]**​ をクリックします。
    
    ![カスタムダッシュボードのウィジェット](/mulesoft/current/ja-jp/monitoring/_images/dashboard-custom-widgets.png)
    
    チャートアイコンが行に表示されない場合、次の手順を実行します。
    
    1. 行にマウスポインターを置き、行の ​![](/mulesoft/current/ja-jp/monitoring/_images/more-menu-vert-ellipsis.png)​ (​**\[More (その他)\] メニュー**​) を表示して、​**\[+ Add widget (+ ウィジェットを追加)\]**​ をクリックします。
    2. 行のいずれかのチャートの種類をクリックします。
3. チャートにマウスポインターを置き、その ​![](/mulesoft/current/ja-jp/monitoring/_images/more-menu-vert-ellipsis.png)​ (​**\[More (その他)\] メニュー**​) を表示して、​**\[Configure (設定)\]**​ をクリックします。
4. カスタムダッシュボードのチャートを設定するには、以下を参照してください。
    
    - [グラフの設定](https://docs.mulesoft.com/jp/monitoring/dashboard-custom-config-graph)
    - [Singlestat チャートの設定](https://docs.mulesoft.com/jp/monitoring/dashboard-custom-config-singlestat)
    - [テーブルの設定](https://docs.mulesoft.com/jp/monitoring/dashboard-custom-config-table)
    - [テキストパネルの設定](https://docs.mulesoft.com/jp/monitoring/dashboard-custom-config-text)

## [](#dup_dashboard)カスタムダッシュボードの複製

カスタムダッシュボードのコピーを作成する手順は、次のとおりです。

1. **\[Custom Dashboards (カスタムダッシュボード)\]**​ から、カスタムダッシュボードを開きます。
2. ダッシュボードのヘッダーから、​![](/mulesoft/current/ja-jp/monitoring/_images/more-menu-vert-ellipsis.png)​ (​**\[More (その他)\] メニュー**​) をクリックし、​**\[Duplicate (複製)\]**​ を選択します。
3. ダッシュボードを ​**\[New Name (新しい名前)\]**​ で保存します。
    
    ダッシュボードのコピーが開きます。

## [](#csv-へのアプリケーションデータのエクスポート)CSV へのアプリケーションデータのエクスポート

アプリケーションデータを CSV ファイルにエクスポートし、そのファイルを他のアプリケーションで使用できます。

1. **\[Custom Dashboards (カスタムダッシュボード)\]**​ から、カスタムダッシュボードを開きます。
2. チャートのヘッダーから、​![](/mulesoft/current/ja-jp/monitoring/_images/more-menu-vert-ellipsis.png)​ (​**\[More (その他)\] メニュー**​) をクリックし、​**\[Export CSV (CSV をエクスポート)\]**​ を選択します。

アプリケーションデータのエクスポート方法についての詳細は、​[「CSV へのアプリケーションデータのエクスポート」](https://docs.mulesoft.com/jp/monitoring/export-app-data-to-csv)​を参照してください。

## [](#delete_dashboard)カスタムダッシュボードの削除

1. **\[Custom Dashboards (カスタムダッシュボード)\]**​ から、カスタムダッシュボードを開きます。
2. ダッシュボードのヘッダーから、​![](/mulesoft/current/ja-jp/monitoring/_images/more-menu-vert-ellipsis.png)​ (​**\[More (その他)\] メニュー**​) をクリックし、​**\[Delete (削除)\]**​ を選択します。
3. 削除を確認します。

## [](#関連情報)関連情報

- [カスタムダッシュボードの作成](https://docs.mulesoft.com/jp/monitoring/create-custom-dashboard)
- [ダッシュボード設定リファレンス](https://docs.mulesoft.com/jp/monitoring/dashboard-config-ref)
- [CSV へのアプリケーションデータのエクスポート](https://docs.mulesoft.com/jp/monitoring/export-app-data-to-csv)