# ネットワーク グラフ

ネットワーク グラフ (Network chart) により、データ セットからシートまでの接続ノードとエッジによるネットワークを描画できます。ネットワーク グラフには、情報の流れ、コンポーネントの相互作用、ネットワーク内のコンポーネントの配置場所が示されます。ネットワーク グラフは Visualization Bundle に含まれています。

ネットワーク グラフでは、広範な概要や詳細な部分が表現されます。ノードはシステムのコンポーネントを表し、エッジはコンポーネントからコンポーネントへの情報の動きを示します。ネットワーク ノードは、最も頻繁に相互作用する相手のノードに接続されます。このビジュアライゼーションでは、さまざまなスタイル、色、サイズ、画像を使用してネットワークの異なるレベルを表現します。

一度に 1 つずつ選択して、ネットワーク グラフを操作します。

[Network Chart](https://play.vidyard.com/eB5dYhHpX6d2ZUcWQnq6kK)

## 含まれる要素

3 つの軸を定義する必要があり、任意で 4 つ目の軸を定義できます。

* ノード識別子: この軸により、チャートに表示されるノードを制御します。
* ノード ラベル: この軸により各ノードのラベルを設定します。
* 親ノード: この軸により、ノードの親を設定し、ノード間の関係を制御します。接続先の親のノード識別子の値が入力されている必要があります。
* ノード グループ (任意): この軸を使用してノードをグループ化できます。同じグループ内のすべてのノードは同じ色で色付けされます。

メジャーを 3 つまで使用して図の内容を強化できます。すべてのメジャーは任意ですが、次の順序で追加する必要があります。

1. ツール ヒント: ノードにマウスを合わせたときにツール ヒントに表示されるメジャーの値を設定できます。
2. ノード サイズ: メジャーに従ってノードのサイズを設定できます。
3. エッジ サイズ: メジャーに従ってノード間の線幅を設定できます。

情報メモノード サイズを設定できるようにするには、まずツール ヒントを追加する必要があります。エッジ サイズはツール ヒントとノード サイズを追加した後に設定できます。

## 使用に適しているケース

ネットワーク グラフの図により、コンピューターまたは無線通信ネットワークを示すことができます。図には、ネットワークのコンポーネントと、コンポーネントどうしの相互作用が示されます。たとえば、接続されているコンピューター、プリンター、モデム、ハブ、ルーターのグループなどです。このタイプのチャートは次の場合に有効です。

* ネットワークの構造計画。
* 既存ネットワークに応じた更新の調整。
* ネットワーク問題の報告とトラブルシューティング。
* コンポーネントの把握。
* 詳細なネットワーク文書の作成。

## データの書式設定

ネットワーク グラフには、各レコードに複数の親と子を持つことができるネットワーク データ モデルに従って、一貫して構造化されているデータが必要です。各レコードには、少なくとも以下の項目が含まれている必要があります。

* ノードを識別する項目 (つまりノード識別子)。ノード識別子の値は、0 から始まる順列の整数値になっている必要があります。
* ノードの名前の付いた項目。
* 親ノードを定義する項目。この値は、別のノードのノード識別子である必要があります。この項目が空で、このノードを参照する他のレコードがない場合は、切断されたノードが作成されます。

ヒント メモ各ノードに親が 1 つ存在する階層型データ モデルを使用することも可能です。この場合はツリー形状のチャートが作成されます。

ここで、テキスト エディタに保存し、新しいアプリにロードすることができるサンプル データを示します。サンプル ファイルは両方ともロードする必要があります。この例は、さまざまな空港間の乗客の流れを示しています。

* ID は空港ノードの識別子です。
* Name は空港ノードの名前です。これは、ノードのラベルとして使用されます。
* LinkTo には、親ノードのノード識別子が格納されています。
* Group はノードのグループを示します。この情報は、グループに応じたノードの色分けに使用されます。
* Volume は、ID と LinkTo の間の乗客の流れの量です。この情報は、エッジ サイズのメジャーをとして使用できます。
* NodeVolume は、1 つのノードでの乗客全体の流れの量です。チャートではこの量を自動的に合計できないので、別々のテーブルにロードされます。

例1： Airports1.csv

```
ID;Name;LinkTo;Group;Volume
0;Frankfurt;;0;
1;London;0;1;5
2;Madrid;0;1;4
2;Madrid;1;1;8
3;Warsaw;0;1;7
4;Arlanda;0;1;1
3;Warsaw;1;1;5
4;Arlanda;1;1;6
5;Tunis;0;2;8
5;Tunis;2;2;4
6;Berlin;0;1;6
6;Berlin;4;1;4
7;Rome;0;1;6
7;Rome;6;1;3
8;San Francisco;0;3;2
9;New York;0;3;9
```

例2： Airports2.csv

```

ID,NodeVolume
0,48
1,24
2,16
3,12
4,11
5,12
6,13
7,9
8,2
9,9
```

## ネットワーク グラフの作成

このネットワーク グラフの例では、基本データ セットに基づいて世界中の空港どうしの繋がりを図示します。ここでは、「[データの書式設定](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Sense_Hub/Visualizations/VisualizationBundle/network-diagram.htm#Formatti)」でのデータ セット例を使用します。データ セット例をテキスト ファイルに保存し、新しいアプリを作成し、データ セット例をロードすることによって準備します。

次の手順を実行します。

1. アセット パネルで [カスタム オブジェクト] &gt; Visualization bundle を開き、[ネットワーク グラフ] オブジェクトをシートにドラッグします。

2. 一番上の [軸の追加] ボタンをクリックし、ノード識別子として「ID」を選択します。

3. 2 番目の [軸の追加] ボタンをクリックし、ノード ラベルとして「Namae」を選択します。

4. 3 番目の [軸の追加] ボタンをクリックし、親ノードとして「LinkTo」(リンク先) を選択します。

5. プロパティ パネルで [データ] をクリックします。[ノード グループ] で [軸を追加] ボタンをクリックし、グループ軸として「Group」を選択します。

6. [メジャー] の [ツール ヒント] で [追加] ボタンをクリックし、[Volume] &gt; [Sum(NodeVolume)] を選択します。

7. [ノード サイズ] で [追加] ボタンをクリックし、[Volume] &gt; [Sum(NodeVolume)] を選択します。

8. [エッジ サイズ] で [追加] ボタンをクリックし、[Volume] &gt; [Sum(Volume)] を選択します。

   チャートが表示されます。

   ![動的エッジ タイプで、ドット ノードと可視曲線値を含み、軸が 4 つでメジャーが 3 つのチャート。](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Resources/Images/ex_gen_networkchart.png)

## チャートのスタイルの変更

グラフは 1 つ以上の機能を指定してカスタマイズできます。

### エッジ タイプの設定

プロパティ パネルの [設定] &gt; [エッジ タイプ] で、チャート ノード間の曲線の形状を設定できます。メニューからチャート曲線の形状オプションを選択します。

動的エッジ タイプ (曲線) のチャート。

動的エッジ タイプ (曲線) のチャート。

動的エッジ タイプ (曲線) のチャート。   
![動的エッジ タイプ (曲線) のチャート。](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Resources/Images/b2_335x227.png)

曲線 CW エッジの同じチャート。

曲線 CW エッジの同じチャート。

曲線 CW エッジの同じチャート。![曲線 CW エッジの同じチャート。](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Resources/Images/bild7_337x292.png)

### エッジ値の切り替え

エッジ値は、チャート ノードとそれらの幅の間の曲線の値を表します。このオプションにより、各曲線の数値を非表示にします。値を非表示にするには、プロパティ パネルの [設定] &gt; [Display edge value] でスライド ボタンを左にスライドしてこのオプションをオフにします。

### エッジ ラベルの設定

エッジ ラベル値は各チャート曲線の数値です。これらのラベルは、位置を変更したり非表示にしたりすることができます。

* エッジ ラベル値を非表示: このオプションにより、ネットワーク グラフのエッジ ラベルを非表示にします。プロパティ パネルの [設定] &gt; [Display edge value] で、スライド ボタンを切り替えます。

* エッジ ラベルの位置: このオプションにより、各チャート曲線上でのエッジ値の表示位置 (上または下) を決定します。メニューから該当するオプションを選択します。

### ノード形状の設定

ノードの形状はカスタマイズすることができます (点、方形、ダイアモンド形、または三角形)。プロパティ パネルで [設定] &gt; [Node shape] の順に移動し、メニューからノード形状を選択します。

### 影オプションの切り替え

このオプションにより、(背景をハイライトするのに使用される) チャート曲線およびノードの背後の影効果をオフにすることができます。プロパティ パネルの [設定] &gt; [Display shadow] で、スライド ボタンを切り替えます。

### ソート

既定のソート順序が選択されているシステムの場合 (プロパティ パネルの [ソート] から選択済みの軸またはメジャーで設定)、[ソート] は「自動」に設定されます。ソート順は数式によって個別に変更できます。

次の手順を実行します。

1. プロパティ パネルの [ソート] で、軸またはメジャーのメニューを開きます。
2. [ソート] スライド ボタンを左にスライドしてこのオプションを「自動」から「カスタム」に切り替えます。
3. [数式によるソート] チェック ボックスをオンにします。
4. [数式] で順序文字列を入力し、Enter を押します。数式エディタで、数式を使用して色を変更することもできます (the 数式エディターを開く icon)。
5. 下のメニューで [昇順] または [降順] を選択して開始順序を選択します。

### 数値書式

メジャー値は書式設定することが可能です。同じ値に、貨幣、日付、または期間などの異なる書式設定を適用可能です。チャートが更新され、変更された数値型が反映されます。

次の手順を実行します。

1. プロパティ パネルで [データ] &gt; [メジャー] をクリックし、選択したメジャーをクリックします。
2. [数値書式] メニューで、適切な数値書式を選択します。
3. パネルの項目に詳細を入力します。これらの項目は、グラフを設定するときに「自動」以外のオプションを選択すると表示されます。

## スタイル パネルを使用してスタイルをさらにカスタマイズする

プロパティ パネルの [スタイル] には、さまざまなスタイル オプションが用意されています。

チャートのスタイル指定をさらにカスタマイズするには、[スタイル] &gt; [プレゼンテーション] で [the スタイル指定 icon] をクリックします。 各セクションの横にある ![リセット](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Resources/Images/Icons/reset.svg) をクリックすると、スタイルをリセットできます。![リセット](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Resources/Images/Icons/reset.svg) [すべてをリセット] をクリックすると、スタイル指定パネルで使用可能なすべてのタブのスタイルがリセットされます。

個々のビジュアライゼーションのスタイル指定に関する一般的な情報については、「 [ビジュアライゼーションへのカスタム スタイル指定の適用](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Sense_Hub/Visualizations/style-visualization.htm)」を参照してください。

### テキストのカスタマイズ

[スタイル] &gt; [基本設定] で、タイトル、サブタイトル、脚注のテキストを設定できます。これらの要素を非表示にするには、[タイトルを表示] をオフにします。

チャートの異なるラベルの可視性は、チャートごとの設定とラベル表示オプションによって異なります。これらはプロパティ パネルで構成できます。

チャートに表示されるテキストのスタイルを指定できます。

次の手順を実行します。

1. プロパティ パネルで、 [スタイル] セクションを展開します。

2. [スタイル] &gt; [プレゼンテーション] で、the スタイル指定 icon [] をクリックします。

3. [基本設定] タブで、次のテキスト要素のフォント、強調スタイル、フォント サイズ、色を設定します。

   * タイトル

   * サブタイトル

   * 脚注

### 背景のカスタマイズ

チャートの背景をカスタマイズできます。背景は、色と画像で設定できます。

次の手順を実行します。

1. プロパティ パネルで、 [スタイル] セクションを展開します。

2. [スタイル] &gt; [プレゼンテーション] で、the スタイル指定 icon [] をクリックします。

3. スタイル指定パネルの [一般] タブでは、背景色 (単一色または数式) を選択できます。メディア ライブラリまたは URL から画像を背景に設定することもできます。

   背景色を使用する場合は、スライダーを使用して背景の不透明度を調整します。

   背景画像を使用する際、画像のサイズや位置を調整できます。

### 境界線と影のカスタマイズ

チャートの境界線と影をカスタマイズできます。

次の手順を実行します。

1. プロパティ パネルで、 [スタイル] セクションを展開します。

2. [スタイル] &gt; [プレゼンテーション] で、the スタイル指定 icon [] をクリックします。

3. スタイル パネルの [一般] タブの [境界線] で、 [枠線] のサイズを調整してチャートの周囲の境界線を増減します。

4. 境界線の色を選択します。

5. [角の半径] を調整して、境界線の丸みを制御します。

6. [一般] タブの [影] で、影のサイズと色を選択します。影を消す場合は、 [None] (なし) を選択します。

## 制限事項

全般的な制限事項については、「[制限事項](https://help.qlik.com/ja-JP/sense/May2025/Subsystems/Hub/Content/Sense_Hub/Visualizations/VisualizationBundle/visualization-bundle.htm#Limitati)」を参照してください。

* ネットワーク グラフのビジュアライゼーションは、Qlik NPrinting レポートで使用することはできません。

* ネットワーク グラフに表示されるデータ セットの最大サイズは 1400 行です。選択したデータ セットが大きい場合は、ノードとリンクをグラフから省略できます。

  より小さなデータ セットを使用するか、選択を使用してデータ セットを制限します。

関連する学習:

* [Visualization Bundle ネットワーク チャートを構成する方法](https://help.qlik.com/lnk/How_configure_Visualization_Bundle_Network_chart)

## 詳細を見る

* [Visualization Bundle ネットワーク チャートを構成する方法](https://help.qlik.com/lnk/How_configure_Visualization_Bundle_Network_chart)