Layout 拡張・モジュール ／WEB アプリ
デモ・カテゴリー
以下の８つのカテゴリーから、１つを選んで下さい
- 日本語
- 基本的なサンプル
- ノード／エッジの外観属性
- ユー ザ・インターフェイス
- グループの展開／畳込
- 多様なレイアウト
- グルーピング（フォルディング）
- グラフ・アルゴリズム（経路探索..）
- 全てのサンプル
ビジネス・プロセスダイアグラム（日本語）
カテゴリー： 日本語, 基本的なサンプル
ビジネス・プロセス ダイアグラム は、ビジネス・プロセスにおけるワーク・フローを表示する。 そのダイアグラムの表現は、BPMN 1.1 の規約に準拠している。 規約の全ての要素は表示していないが、yFiles FLEX を用いて、如何に実装するかを例示している。:
- BPMN 1.1 の規約に準拠した形状を用いた「カスタム・ノード・スタイル」
- SWIM レーンにおいて、テンプレート・ノード・スタイルを用いる
- BPMN 1.1 の関連規約に準拠した「カスタム・矢印を持ったカスタム・エッジ・スタイル」
- ノードとエッジに、データを関連付けする「ユーザ・タグ」を用いる
- SWIM レーンにおいて、グループ・ノード用の小アイコンを用いる
- ドラッグ＆ドロップを利用して、容易にノードを追加できる
- ポート制約を利用して、BPMN 1.1 の規約に準拠するように、エッジを上手く接続する
- 入力モードをカスタマイズできる
- ノードの位置セッティングを強力に補助するガイド機能
- ビジネス・モデルの要素(ノード)を意味付けして、直並列的に接続する
- レイアウト設定において、格子点情報を利用できる
- レイアウト設定において、レイアウト手順をカスタマイズできる
展開／縮退操作に対応したツリー・デモ
カテゴリー： グループの展開／畳込
展開／縮退操作に対応したツリー・デモ は yFiles FLEX アプリで、標準的なツリーに対する操作を超えた機能を提供する。
ロードされたデータに含まれる部分ツリーを、容易に展開／畳込できる。畳込された部分ツリーに含まれるノードは隠されて見えなくなる。その変化に影 響されて、グラフ全体のレイアウトが影響をうけます。
エッジ・ラベリング デモ
カテゴリー： 多様なレイアウト, ノード／エッジの外観属性
エッジ・ラベリング デモ は、エッジのラベルと関連するエッジ・ラベル・モデルを構成する手順を表示する。
普遍的なツリー・レイアウター デモ
カテゴリー： 多様なレイアウト
普遍的なツリー・レイアウター デモ は、普遍的なツリー・レイアウターに対して、レイアウターと独立した個別のノードを表示します。
階層的なグルーピングを対話的に行うデモ
カテゴリー： グループの展開／畳込, グルーピング（フォルディング）
階層的なグルーピングを対話的に行うデモは、グループを持ったグラフに対して、グループの展開／畳込の操作を示します。
階層的レイアウターを対話的に行うデモ
カテゴリー： 多様なレイアウト, ユーザ・インターフェイス
階層的レイアウターを対話的に行うデモは、洗練された対話的操作を持った「階層的レイアウター」を示します。
グラフに対して何らかの修正を行うと、自動的にレイアウターを更新する。但し、レイアウターは、ノードが存在するレイヤーを変更しません。さらに、
各レイヤーに含まれるノード・シーケンスは保持されます。
レイヤー制約 デモ（日本語）
カテゴリー： 日本語, 多様なレイアウト, ユーザ・インターフェイス
レイヤー制約 デモ は、インクリメンタル・階層的レイアウターに対して制約を設定して、ノードを特定レイヤーに制約します。
レイアウト・モジュール デモ（日本語）
カテゴリー： 日本語, 基本的なサンプル, 多様なレイアウト
レイアウト・モジュール デモ
は、yFiles
で対応している重要なレイアウターについて示します。また、それらのレイアウター・アルゴリズムの複雑な構成を示します。
レイアウターが持つ属性を編集するためのAPIがサンプルのソース・コードに含まれます。以下の５つのタイプのレイアウターに対応している:
- Hierarchic （階層的レイアウター）
- Orthogonal （直交レイアウター）
- Organic （組織的レイアウター）
- Circular （円環状レイアウター）
- Tree （ツリー・レイアウター）
ロジック・ゲート デモ
カテゴリー： ユーザ・インターフェイス, 多様なレイアウト
ロジック・ゲート デモ は、ポートの有効な候補から選んで利用する手順を示します。
混合レイアウト デモ
カテゴリー： 多様なレイアウト
混合レイアウト デモ は、複数のグループ・ノードに対して、異なったレイアウターを繰返し適用する手順を示します
ナビゲーション デモ
カテゴリー： 基本的なサンプル, グループの展開／畳込
ナビゲーション デモ は、大規模なグラフにおいて、選択ノードに接続される近辺ノードに注目して表示します。別なノードを選択すると、そのノードに接続される近辺ノードに注目 して再レイアウトして表示します。
組織チャート デモ（日本語）
カテゴリー： 日本語, 基本的なサンプル, グループの展開／畳込, ノード／エッジの外観属性
組織チャート デモ は、組織チャートの種々の側面を、対話的な操作で表示します。
yFiles FLEX ライブラリーの持つ以下の特徴を活用しています:
- XMLファイルから、組織チャート用のグラフを描画する
- 状況に応じて、部分グラフに切替えて表示する
- テンプレート・ノード・スタイルを用いて、個々のノードの属性を表示する
- 拡大・縮小の状況に応じて、ノードの表示属性を制御する
- マウス・ホイールの上下移動で、グラフを拡大／縮小できる
- グラフ全体表示において、ノードの状況を色で表現できる
- 再レイアウトを実施する時に、アニメーションを伴って実行する
部分グラフ・レイアウト デモ
カテゴリー： 多様なレイアウト
部分グラフ・レイアウト デモ
は、特定の部分グラフに対してレイアウトを実施します。hierarchic（階層的）, orthogonal（直交）, organic（組織）
や circular(円環状) レイアウターに対して、種々の設定を試してみることが出来ます。
ポート指定 デモ
カテゴリー： 多様なレイアウト
ポート指定 デモは、インクリメンタル・階 層レイアウターを用いて、予め設定されたポートの候補から１つを選択しながらエッジを接続する。
接続順序・制約 デモ
カテゴリー： 多様なレイアウト, ユーザ・インターフェイス
接続順序・制約 デモ は、インクリメンタル・階層レイアウターを用いて、ノード間の接続順序による施薬に従ってレイアウトを実行します。
最短経路・探索 デモ
カテゴリー： グラフ・アルゴリズム（経路探索..）
最短経路・探索 デモは、yFiles
FLEX で、グラフ・アルゴリズムの使用事例を紹介します。このデモは、指定したノード間の最短経路をインターラクティブに計算する。
シンプル・レイアウト デモ
カテゴリー： 多様なレイアウト
シンプル・レイアウト デモ
は、yFiles FLEX において、グラフ・レイアウターの種々の使用法を示します。
スウィム（SWIM）レーン デモ
カテゴリー： ユーザ・インターフェイス, ノード／エッジの外観属性, 多様なレイアウト
スウィム（SWIM）レーン デモ は、”インクリメンタル・階層レイアウター” を用いて、スウィム（SWIM）レーンに対する階層レイアウターの実装を示します。
テンプレート・スタイル デモ
カテゴリー： ノード／エッジの外観属性
テンプレート・スタイル デモ
は、”テンプレート・ノード・スタイル” と ”テンプレート・エッジ・スタイル”
を用いて、複雑なノードのラベル属性などを表現できる。その定義は、MXML コンポーネントにより構成されます。