JGraph

せりか式 - マニュアル - JGraph

NetBeansから使えるグラフィックコンポーネントです.グラフを書くのに特化しています.

JGraphがオフィシャルサイトで, 本コンポーネントを使うには,パッケージorg.jgraph.*のインポートが必要です. 他にも,eventのパッケージとかあるので必要に応じてインポートしてください.

各APIの詳細は,JGraphAPI Specificationを参考にしてください.

目次

インストール

  1. ダウンロード
    JGraphJGraph - Free Versionあたりから最新版のBiniaryをダウンロードする
    このときのパスに日本語や空白が入る場所に保存すると,次の解凍がうまくいかない場合があるようです.
  2. 解凍
    ダウンロードしたjarを立ち上げればライセンスが表示されて解凍先選択ダイアログが出ます. どこに解凍してもいいのですが,デスクトップなどよりも,全ユーザがアクセスできるところに置いた方が無難です
  3. NetBeansへの登録
    [ツール] - [パレットマネージャー] - [Swing/AWT コンポーネント]から開けるパレットマネージャーから追加します.
    [Jarから追加...]ボタンから,さきほど解凍たファイル lib/jgraph.jar を追加します.
    パレットに追加するコンポーネントは,JGraphです.
    パレットカテゴリはどこでも構いません.Swingの中にでも入れておけばいいかと思います.
    これで,パレットに追加されたはずですが,もし入っていない場合は,パレットウィンドウを一度閉じて,改めて開いてみてください.
  4. 利用
    あとは適当に配置すれば他のSwingコンポーネントと同じように使えます.

初期化

通常配置すると,標準でSampleModelがグラフに追加されるようになっています. 何もないモデルを作成したい場合は,配置したコンポーネントの[プロパティー] - [コード] - [カスタム生成コード]に new JGraph(new DefaultGraphModel());を入力します. 最後のセミコロンまで必要です.

セル

すべてのノードやエッジはセル(cell)として扱われます. このセルを作成し,グラフに追加することになります.

ノード

いわゆる要素です.次の例は,"node"という名前のノードを作成し,グラフに挿入します.

ノードの作成
1: DefaultGraphCell[] cells = new DefaultGraphCell[1];
2: cells[0] = new DefaultGraphCell(new String("node"));
3: // 作成したcellに対しての属性の設定 
4: jGraph1.getGraphLayoutCache().insert(cells);

ノードには,名前の他,その大きさやエッジを繋ぐためのポートが設定できます. パラメータは,GraphConstantsのメソッドを利用します.
以下は,上記のプログラムの3行目に追加する場合の例です.

座標と大きさ
GraphConstants.setAutoSize(cells[0].getAttributes(), true);
ノードに設定されている文字列に合わせて,大きさを自動的に設定するようにする.
GraphConstants.setForeground(cells[0].getAttributes(), Color.blue);
前景色をblueにする.
GraphConstants.setBackground(cells[0].getAttributes(), Color.blue);
背景色をblueにする.
GraphConstants.setBorderColor(cells[0].getAttributes(), Color.blue);
ボーダーの色をblueにする.
GraphConstants.setGradientColor(cells[0].getAttributes(), Color.blue);
色をblueのグラデーションにする.
ポート

エッジを接続する場合,ポートを設定しておく必要があります. この場合,Graphconstantsではなく,cellのaddを直接呼び出します.

ポートの作成
cells[0].add(new DefaultPort());

エッジ

要素間を結ぶ線です.次の例は,"edge"という名前のノードを作成し,グラフに挿入します.

エッジの作成
1: DefaultEdge edge = new DefaultEdge(new String("edge"));
2: // 作成したcellに対しての属性の設定 
3: DefaultGraphCell[] cells = new DefaultGraphCell[1];
4: cells[0] = edge;
5: jGraph1.getGraphLayoutCache().insert(cells);

ノードと同じく,GraphConstantsのメソッドで属性を指定できます.
以下は,上記のプログラムの2行目に追加する場合の例です.

座標と長さ
GraphConstants.setPoints(edge.getAttributes(), vec);
エッジの座標を指定します.以下の例は,座標(10, 10)から座標(100, 100)の間に線を引きます.
使い方
1: java.util.List vec = new java.util.Vector();
2: vec.add(new Point2D.Double(10, 10));
3: vec.add(new Point2D.Double(100, 100));
4: GraphConstants.setPoints(edge.getAttributes(), vec);
線の種類
GraphConstants.setLineEnd(edge.getAttributes(), GraphConstants.ARROW_CLASSIC);
エッジの終端を指定します. この例では,普通の矢印にしています. 指定できるタイプについては,GraphConstantsのField Summary中のALLOWで始まる定数を参照してください.

図の挿入

オフィシャルサイトからの引用と一部修正

使い方
01: DefaultGraphCell[] cells = new DefaultGraphCell[3];
02: // 1つ目のセルを作成
03: cells[0] = new DefaultGraphCell(new String("Subject"));
04: GraphConstants.setBounds(cells[0].getAttributes(), new Rectangle2D.Double(20,20,40,20));
05: GraphConstants.setGradientColor(cells[0].getAttributes(), Color.orange);
06: GraphConstants.setOpaque(cells[0].getAttributes(), true);
07: cells[0].add(new DefaultPort());
08: // 2つ目のセルを作成
09: cells[1] = new DefaultGraphCell(new String("Object"));
10: GraphConstants.setBounds(cells[1].getAttributes(), new Rectangle2D.Double(140,140,40,20));
11: GraphConstants.setGradientColor(cells[1].getAttributes(), Color.red);
12: GraphConstants.setOpaque(cells[1].getAttributes(), true);
13: cells[1].add(new DefaultPort());
14: // 各セルを結ぶエッジを作成
15: DefaultEdge edge = new DefaultEdge();
16: edge.setSource(cells[0].getChildAt(0));
17: edge.setTarget(cells[1].getChildAt(0));
18: cells[2] = edge;
19: int arrow = GraphConstants.ARROW_CLASSIC;
20: GraphConstants.setLineEnd(edge.getAttributes(), arrow);
21: GraphConstants.setEndFill(edge.getAttributes(), true);
22: GraphConstants.setGradientColor(edge.getAttributes(), Color.blue);
23: // グラフに挿入: jGraphは配置したグラフ
24: jGraph.getGraphLayoutCache().insert(cells);
cellの形を自分で作る

JGraph manual(PDF)の3.4.2 - 3.4.3あたりを参考に.

cellを描画するクラスやそのクラスを生成するファクトリーなど,いくつかのクラスを作る必要があります. もし,cellも使い分けるのなら,DefaultGraphCellを派生させ,cellの区別が付くようにする必要もあります. また,適当なタイミングでFactoryを切り替える必要があります. JGraphオブジェクト生成時に行うなら,graph = new JGraph(new GraphLayoutCache(new DefaultGraphModel(), new MyFactory()));のようになります.

下の例では,よけいなメソッドの作成を省略するために,VertexViewと,VertexRendererを派生させています. edgeならEdgeViewとEdgeRendererをもとに派生させると楽かもしれません.

描画するクラス MyView.java
01: // AbstractCellViewから派生する必要があります
02: public class MyView extends VertexView { 
03:   protected static MyRenderer renderer = new MyRenderer();
04:   // コンストラクタ
05:   public MyView() {
06:     super();
07:   }
08:   public MyView(Object arg0) {
09:     super(arg0);
10:   }
11:   // 実際の描画オブジェクトの取得
12:   public CellViewRenderer getRenderer() {
13:     return renderer;
14:   }
15:   // エッジで結ぶときの,座標の取得
16:   // ここでは,実際に描画を行うレンダラーに計算を任せてます
17:   public Point2D getPerimeterPoint(EdgeView edge, Point2D source, Point2D p) {
18:     if (getRenderer() instanceof MyRenderer)
19:       return ((MyRenderer)getRenderer()).getPerimeterPoint(this, source, p);
20:     return super.getPerimeterPoint(edge, source, p);
21:   }
22:   // JLabelを派生させ,CellViewRendererとSerializableをimplementsしておく必要があります
23:   public static class MyRenderer VertexRenderer {
24:     public MyRenderer(){
25:       super();
26:     }
27:     // 実際の描画
28:     public void paint(Graphics g) {
29:       // cellの大きさ(getWidth(), getHeight())に合わせて適当に描画
30:       // ここでは赤く塗りつぶした楕円を描画
31:       Graphics2D g2d = (Graphics2D) g;
32:       g2d.setPaint(Color.red);
33:       g2d.fillOval(0, 0, getWidth(), getHeight());
34:     }
35:   }
36: }

CellViewFactoryをインプリメントする必要があります. といっても中にあるのは,cellのタイプに合わせて,描画オブジェクトを返すcreateViewだけですが.

ファクトリー MyFactory.java
01: public class MyFactory extends DefaultCellViewFactory{
02:   // コンストラクタ
03:   public MyFactory() {
04:     super();
05:   }
06:   // edge, port以外の場合に呼び出されるので,オーバーライド
07:   protected VertexView createVertexView(Object cell) {
08:   // 自前のcellなら,先ほど作成した描画クラスを返す
09:     if(cell instanceof MyCell){
10:       return new MyView(cell);
11:     }
12:     return new VertexView(cell);
13:   }
14: }

特になにもしていませんが,オリジナルのcellです. このcellの場合,ファクトリーが,MyViewを作り出します.

オリジナルのcell MyCell.java
01: public class MyCell extends DefaultGraphCell{
02:   // コンストラクタ
03:   public MyCell() {
04:     this(null);
05:   }
06:   public MyCell(Object userObject) {
07:     this(userObject, null);
08:   }
09:   public MyCell(Object userObject, AttributeMap storageMap) {
10:     this(userObject, storageMap, null);
11:   }
12:   public MyCell(Object userObject, AttributeMap storageMap, MutableTreeNode[] children) {
13:     super(userObject, storageMap, children);
14:   }
15: }

トップへ