モジュールの依存関係ダイアグラム

モジュール依存関係ダイアグラムをビルド

JavaScript、TypeScript、HTML ファイルのコンテキストメニュー、またはフォルダーのコンテキストメニューからダイアグラム | ダイアグラムの表示を選択します。
node_modules および 除外 フォルダーでは、この操作は使用できません。
複数の型のダイアグラムを作成できるフォルダーでアクションが呼び出された場合は、さらにダイアグラムタイプの選択リストから JavaScript モジュール依存関係ダイアグラムを選択してください。

RubyMine は、選択したファイルまたは選択したフォルダー内のすべてのファイルの import および require ステートメントと script タグを再帰的に解析し、別のタブでこれらのファイルが互いにどのように依存しているかを示すダイアグラムを表示します：

ダイアグラムは、いくつかの長方形で構成されています。それらのそれぞれは、分析された選択されたファイルの名前と検出されたインポートのリストを示します。インポートが解決されると、インポートされたシンボルの種類を示すアイコン（やなど）がその横に表示されます。
分析されたファイルからの矢印は、検出されたインポートが行われるターゲットファイルを指します。対象ファイルがライブラリの場合は、灰色の背景にファイル名が表示されます。ライブラリからのインポートが解決されない場合、ターゲットファイルは赤い枠が付いた灰色の四角形として表示されます。
解決されたインポートとエクスポートは、それぞれまたはアイコンでマークされます。

ダイアグラムの分析

ダイアグラムまたはノードのコンテキストメニューからグラフの分析を選択し、必要なアクションを選んでください。

ダイアグラムの特性を表示

ダイアグラムに関する一般情報や統計を取得するには、ダイアグラムのコンテキストメニューからグラフの分析 | グラフの特性を表示を選択してください。
特定のメトリクスを詳しく見るには、その横にあるをクリックしてください。

選択したノードにフォーカス

複数のノードをより詳しく調べるには、それらを選択し、コンテキストメニューからグラフの分析 | 選択したノードに注目するを選択してください。
現在選択されているノード以外のすべてのノードが非表示になります。
ダイアグラムを元に戻すには、 Ctrl+Z を押してください。

ノード近隣にフォーカス

ノードをさらに深く調べるには、対象ノードを選択し、そのコンテキストメニューからグラフの分析 | ノードの近傍に注目するを選択してください。
表示された隣接ノードのフォーカスビューダイアログで、表示する依存関係を指定し、検索をクリックしてください。

依存関係とともに選択したノードが表示されます。

ノード間のパスにフォーカス

調べたいノードを選択し、ノード間のパスのコンテキストメニューからグラフの分析 | ノード間のパスに注目するを選択してください。
2 ノード間のパスに注目ダイアログで検索条件を設定し、検索をクリックしてください。

サイクルにフォーカス

循環依存関係のみ表示するには、ダイアグラムのコンテキストメニューからグラフの分析 | サイクルに注目するを選択してください。
表示されたサイクルに注目表示ダイアログで、表示するサイクルの種類と分析スコープを指定してください。

ダイアグラムには、指定したスコープ内で相互に循環インポートを持つモジュールが表示されます。

ダイアグラムの中心性を測定する

このアクションを使用して、ダイアグラム内の重要なノードを特定できます。

ダイアグラムのコンテキストメニューからグラフの分析 | 中心性の測定を選択してください。
表示された中心性の測定ダイアログで考慮する主要なパラメーターを指定し、計測をクリックしてください。
RubyMine は計算された重要度に応じてノードをハイライト表示し、最も重要なノードは最も明るく選択されます。ノードの重要度は 0.0 から 1.0 の小数値で表され、各ノードの横に表示されます。

ノードをクラスターにグループ化

グラフ内のノードは、ノードのエッジの類似性に基づいて自動的にクラスター分けでき、最適なクラスター数を決定するための最新のメソッドが使われます。

ダイアグラムのコンテキストメニューからグラフの分析 | 自動クラスタリングを選択してください。
表示された自動クラスタリングダイアログで、クラスタリングの基準となるパラメーターを選択し、実行をクリックしてください。
RubyMine は生成されたクラスターを表示します。

ダイアグラムからソースコードへの移動

ダイアグラムからファイルへジャンプするには、ダイアグラム内でファイルを右クリックし、コンテキストメニューからソースに移動を選択してください。
ソースコード内の特定の import ステートメントに移動するには、ダイアグラム内の必要なファイルを右クリックし、コンテキストメニューから移動を選択し、ナビゲーションターゲットの選択リストから移動先のシンボルを選択します。

コンテキストメニュー

選択した要素のアクション

このメニュー項目とこのノード配下の項目は、ダイアグラムでノードを選択したときのみ表示されます。

項目	説明
コピー	選択範囲をコピーします。
使用箇所を検索	プロジェクト全体で選択部分の使用箇所を検索します。
表示	選択部分の参照情報を表示します。例えば：クイック定義クイック型定義クイックドキュメント
移動先	ナビゲーションバー宣言または使用箇所。 Implementation(s) 型宣言スーパーメソッド関連シンボル
開く	ファイルパス - 選択した項目が保存されているフォルダーを見るにはこのオプションを選択してください。ターミナルで開く - 選択した項目に対応するディレクトリをターミナルで開きます。
Google 検索	ブラウザーを開いて、選択した項目のファイルパスを Google で検索します。
外部ツール	選択した項目に対して外部ツールを実行します。

コンテンツ

項目	説明
新規	この項目は、ダイアグラムでノードが選択されている場合のみ使用できます。この項目を使って、次の種類のノートを現在のダイアグラムに追加できます。メモ要素ドキュメント付きメモ
可視性レベルの変更	詳細レベルを選択してください。使用可能なオプションは次の通りです：概要詳細 yFiles 公式ウェブサイトから詳しく見ることができます。このアクションはツールバーからも使用できます。

項目

説明

新規

この項目は、ダイアグラムでノードが選択されている場合のみ使用できます。この項目を使って、次の種類のノートを現在のダイアグラムに追加できます。

メモ
要素ドキュメント付きメモ

可視性レベルの変更

詳細レベルを選択してください。使用可能なオプションは次の通りです：

概要
詳細

yFiles 公式ウェブサイトから詳しく見ることができます。

移動

この項目は、ダイアグラムでノードが選択されている場合のみ使用できます。この項目を使って、選択した項目が含むファイルのインポート一覧のポップアップリストを開きます。ポップアップ内のファイルをクリックすると、エディターでそのファイルが開きます。

削除

このアクションは、ダイアグラム内でノードが選択されている場合にのみ使用できます。選択したノードをダイアグラムから削除するには、このアクションを使用してください。

グラフの分析

この項目を選択すると、ダイアグラムを上記の説明通りに分析するアクションにアクセスできます。

リファクタリング

このメニュー項目はノードが選択されている場合のみ使用できます。このメニュー項目を使って、現在のコンテキストで利用できるリファクタリングのポップアップリストを開きます：

レイアウト

このメニュー項目を選択すると、利用可能なダイアグラムレイアウトのポップアップリストが開きます。 yFiles 公式ウェブサイトから詳しく見ることができます。

方向

この項目を選択すると、ダイアグラムを画面上でどのように配置するかを視覚的に選択できるポップアップリストが表示されます。

現在のレイアウトを適用

このメニュー項目を選択すると、ダイアグラムのコンテキストメニューのレイアウトリストから現在選択されているレイアウトを適用できます。このアクションはツールバーからも使用できます。

エッジの自動ルーティング

ダイアグラムの内容をダイアグラムウィンドウ端まで拡大縮小します。このアクションはツールバーからも使用できます。

外観

このメニュー項目を使用すると、エッジやラベルの外観設定やグリッド表示の有無などを設定できます。 yFiles 公式ウェブサイトから詳しく見ることができます。

動作

このメニュー項目は、次のオプションを有効化または無効化するポップアップリストを開くために使います：

グリッドにスナップ
レイアウト後の内容に合わせる
自動レイアウトアルゴリズムがグラフを配置し終えると、ビューポートが自動的にズーム・パンしてダイアグラム全体が表示されます。
設定が有効化されている場合：ノードとエッジがレイアウトアルゴリズムで並び替えられます。その後、キャンバス/view は手動でズームやスクロールをしなくてもすべての内容が表示されるよう自動調整されます。
設定が有効化されている場合：レイアウトは実行されますが、現在のズームレベルやビューポート位置は変わりません。
選択したノードの構造ビューを表示 - このオプションを有効化すると、RubyMine は選択中ノードに対応するファイルの構造ビューを自動的に表示します。

ダイアグラムをクリップボードにコピー

このアクションはツールバーからも使用できます。

選択範囲をクリップボードにコピー

このメニュー項目を選択し、ダイアグラム内の任意のエリアを選択すると、そのエリアがクリップボードにコピーされます。このアクションはツールバーからも使用できます。

ダイアグラムのエクスポート

サードパーティツールと互換性のあるさまざまなフォーマットでダイアグラムをファイル、画像にエクスポートしたり、ブラウザーで開いたりできます。

次のオプションを選択して構成できます：

: このボタンをクリックして、ダイアグラムをエクスポートできるサードパーティのエディターを選択します。
: このボタンをクリックして、使用可能な形式の 1 つを使用してダイアグラムをクリップボードに保存します。
: このボタンをクリックして、現在のダイアグラムをファイルとして保存します。リストから使用可能な形式の 1 つを使用できます。
: このボタンをクリックして、現在のダイアグラムを PNG 形式で保存します。
: このボタンをクリックして、ダイアグラムを印刷します。

このアクションはツールバーからも使用できます。

ツールバー

項目	説明
	このアイコンをクリックして、詳細レベルを選択します。使用可能なオプションは次の通りです：概要詳細 yFiles 公式ウェブサイトから詳しく見ることができます。
/	ダイアグラムを拡大 / 縮小
	このアイコンをクリックすると、ダイアグラムの拡大縮小前の元のサイズに戻ります。
	このアイコンをクリックして、内容を現在のダイアグラムのサイズに合わせます。
	このアイコンをクリックして、ダイアグラムのコンテキストメニューのレイアウトリストから選択した現在のレイアウトを適用します。
	このアイコンをクリックすると、ダイアグラムの内容をダイアグラムウィンドウ端まで拡大縮小します。
	このアイコンをクリックして、ダイアグラムをクリップボードにコピーします。
	このアイコンをクリックし、ダイアグラム内の任意のエリアを選択すると、そのエリアがクリップボードにコピーされます。
	このアイコンをクリックすると、サードパーティツールと互換性のあるさまざまなフォーマットを使用してダイアグラムをファイルや画像にエクスポートしたり、ブラウザーでダイアグラムを開いたりできます。次のオプションを選択して構成できます： : このボタンをクリックして、ダイアグラムをエクスポートできるサードパーティのエディターを選択します。 : このボタンをクリックして、使用可能な形式の 1 つを使用してダイアグラムをクリップボードに保存します。 : このボタンをクリックして、現在のダイアグラムをファイルとして保存します。リストから使用可能な形式の 1 つを使用できます。 : このボタンをクリックして、現在のダイアグラムを PNG 形式で保存します。 : このボタンをクリックして、ダイアグラムを印刷します。
	このボタンをクリックして、ダイアグラム全体をリフレッシュします。
	このボタンをクリックしてダイアグラムの設定を開き、追加のオプションを構成できます。