AddFlow Suite について

インタラクティブなフローチャートとワークフロー図を作成、グラフの描画アルゴリズムを搭載

AddFlowSuiteはコンポーネントスイートであり、AddFlowとLayoutFlowを含み、また、4つのレイアウトコンポーネントのコレクションとして、HFlow(階層的)、SFlow(対称)、TFlow(ツリー)、OFlow(直交)を含みます。

AddFlowSuiteは、AddFlowとLayoutFlowの双方を含みます。

以下に列挙するのは、AddFlowの主要な機能です。コンパクト(375KB)で、堅牢で、高速で、そして使いやすいActiveXコンポーネントの中に、これら全ての機能がカプセル化されることは注目に値します。

全般において

  • ロイヤルティフリーのランタイムライセンス
  • デジタル署名の提供
  • インタラクティブなプログラムによる描画
  • ナビゲーション(ダイアグラム内の全てのノードとリンクへのアクセスを、5つのプロパティだけで実現)
  • コレクション(ノード、リンク、選択されたノード、選択されたリンク)のサポート
  • カスタマイゼーション : 多数のプロパティを用いて、コントロール(CanDrawNode、CanMoveNode、ReadOnlyなど)のカスタマイズを実現

入出力

  • メタファイルのサポート(WMF、EMF)
  • ダイアグラムのシリアライゼーション(LoadFileメソッドとSaveFileメソッド)
  • XMLシリアライゼーション
  • クリップボード管理
  • 印刷と印刷プレビュー

インタラクティブ性

  • スクロール(インタラクティブでありプログラム操作が可能)
  • 自動化されたスクロール
  • ノードとリンクのセレクションとマルチセレクション(インタラクティブでありプログラム操作が可能)
  • アイテムの移動時と、サイズ変更時のノード接続の保持

表示機能

  • OwnerDrawイベントによるカスタマイズされた描画の実現
  • ズーミングの実現
  • グリッドのサポート

データ

  • ノードとリンクによるデータ表現
  • ノードとリンクに対して、テキストおよび、ユニークなキー、ツールチップを結合する能力
  • オブジェクトのカラー設定の順序に関する変更(ZOrderプロパティ)
  • それぞれオブジェクトに対する、個別のカラー設定(FillColor、ForeColor、DrawColor)
  • それぞれオブジェクトに対する、個別のフォント設定
  • 個別の描画スタイル(DrawStyleプロパティ)を実現
  • オブジェクトの隠蔽に対応

リンク

  • 多数のセグメントで構成される、伸縮が可能なリンク。
  • 曲線を用いたリンク(ベジエ、スプライン)
  • ノードがドラッグされたときにオリジナルノードの設定に従う、固定リンクの実現
  • 再帰形式のリンク
  • 垂直と水平のセグメントだけを持つリンク
  • リンクの先端と末尾の位置を調整する能力
  • リンクに対する20種類の矢印スタイル
  • リンクの描画をカスタマイズする能力(OwnerDrawイベント)
  • リンクの自動ルーティング

ノード

  • ノードに対してイメージ(ビットマップ、標準/拡張メタファイル、アイコン、GIF、JPEG)を結合する能力
  • ノードの描画をカスタマイズする能力(OwnerDrawイベント)
  • ノードに対応する46種類のシェイプ
  • カスタムシェイプの実現
  • 透過的なノード表現の実現
  • テキストの位置調整への対応
  • ノードのサイズを自動化するオプション
  • カラーのグラデーション

以下に、LayoutFlowの主要な機能を列挙します。

LayoutFlowの概要

LayoutFlowは、グラフフレイアウトのための4つのコントールのセットです。

  • HFlow(階層的なレイアウト)
  • OFlow(直交的なレイアウト)
  • SFlow(symmetric force directed layout)
  • TFlow(ツリーおよび放射状のレイアウト)

それぞれの製品に関するデモンストレーションは、AddFlowを用いて実現されるLayoutDemoサンプルで提供されています。

HFlowおよび、OFlow、SFlowとTFlowは、AddFlowの拡張版であり、使用するためにはAddFlowが必要となります。一般的には、それぞれのノードに対して最初に、任意あるいは(0,0)ポジションを与え、また、AddFlowAPIを用いることで、AddFlow内にノードとリンクが作成されます。続いて、選択したグラフレイアウトコントロールの、レイアウトメソッドをコールします。このメソッドは、選択されたコントロール(HFlowによる階層や、SFlowによる対称、OFlowによる直交など)に依存する一定の外観に従うことで、AddFlowコントロール内のノードとリンクを合理的な手法により配置します。

AddFlowのLogicalOnlyプロパティがtrueの場合には、AddFlowコントロールの論理的な頂点(ノードとも呼ばれる)だけが、このレイアウトに対する関係を持ちます。それにより、重要な頂点だけに対して、レイアウトを適用できるようになります。たとえば、Logicalプロパティにfalseを設定することで、ラベルを表示するだけのノードを除外することができます。

1) HFlow

HFlowレイアウトアルゴリズムは、水平な階層で頂点を調整するためのものです。その頂点の並びは、交差点の数が小さくなるように選択されます。

HFlowによるソリューションは、最適を目指すものではなく、まさに合理性を考えたものとなります。

2) OFlow

OFlowレイアウトアルゴリズムは、グラフ上で直交するレイアウトを実現します。このレイアウトが直交となる理由は、それぞれのエッジが水平と垂直に交互に接続する多角形として描画する場合に、直交の描画が生成されるためです。

OFlowは、グラフ間の接続の有無にかかわらず機能します。描画の結果として、最大で4度以内のグラフになる場合には、それぞれのノードが同じ大きさを持つことになります。もしノードの角度が4度以上なら、ノードの高さが拡大されることになります。

3) SFlow

SFlowレイアウトアルゴリズムは、グラフ上で対称的なレイアウトを実現します。対称的なレイアウトは、正確な対称を生み出しますが、特に、エッジの方向が重要ではない無向性のグラフにとって有効なものとなります。

多くの場合において、結果として生じるレイアウトは良好です。しかし、膨大な計算上のリソースが必要とされるため、小さいグラフ(300以下のノード数)に対して使用すべきです。

アニメーションモードを使うことで、SFlowの機能する様子を確認することが可能です。

4) TFlow

TFlowレイアウトのアルゴリズムは、グラフ上でのツリーレイアウトを実現します。ツリーレイアウトは、ルーティングされたツリーである、グラフ内の特定のサブセットだけに適用されます。このようなグラフにおいて、複数の親を持つ頂点は存在しません。

ツリーの描画は、一定の美観を満たす一方で、ごく限られた領域だけしか占有しません。DrawingStyleプロパティの値が「Layered」なら:

ツリー上の同じレベルの頂点は、同一線上に配置されます。
親ノードは、その子供たちの中心に配置されます。

DrawingStyleプロパティの値が「Radial」なら:

  • ルートは、もとの位置に配置されます。
  • 階層は、元の位置を中心とした同心円で配置されます。