Tag Archives: JUNG

Learning JUNG (3) – Changing the vertex’s shape

To change the way a vertex is rendered, you provide an implementation of the Renderer.Vertex interface. The interface has one function – paintVertex – where you can draw anything you like, like in the graphics of any JComponent. I changed my example, adding 3 nodes: a circle, a square and a rectangle, each one painted with it’s shape and in a different color.

import java.awt.Color;
import java.awt.Dimension;
import java.awt.Rectangle;
import java.awt.Shape;
import java.awt.geom.Ellipse2D;
import java.awt.geom.Point2D;
import javax.swing.JFrame;
import org.apache.commons.collections15.Transformer;
import edu.uci.ics.jung.algorithms.layout.CircleLayout;
import edu.uci.ics.jung.algorithms.layout.Layout;
import edu.uci.ics.jung.graph.DirectedSparseGraph;
import edu.uci.ics.jung.visualization.RenderContext;
import edu.uci.ics.jung.visualization.VisualizationViewer;
import edu.uci.ics.jung.visualization.control.DefaultModalGraphMouse;
import edu.uci.ics.jung.visualization.control.ModalGraphMouse;
import edu.uci.ics.jung.visualization.renderers.Renderer;
import edu.uci.ics.jung.visualization.transform.shape.GraphicsDecorator;

public class JungLearning {
	public static void main(String[] args) {
		DirectedSparseGraph<String, String> g = new DirectedSparseGraph<String, String>();
		g.addVertex("Square");
		g.addVertex("Rectangle");
		g.addVertex("Circle");
		g.addEdge("Edge1", "Square", "Rectangle");
		g.addEdge("Edge2", "Square", "Circle");
		g.addEdge("Edge3", "Circle", "Square");
		VisualizationViewer<String, String> vv =
			new VisualizationViewer<String, String>(
				new CircleLayout<String, String>(g), new Dimension(400,400));
		Transformer<String, String> transformer = new Transformer<String, String>() {
			@Override public String transform(String arg0) { return arg0; }
		};
		vv.getRenderContext().setVertexLabelTransformer(transformer);
		transformer = new Transformer<String, String>() {
			@Override public String transform(String arg0) { return arg0; }
		};
		vv.getRenderContext().setEdgeLabelTransformer(transformer);
		vv.getRenderer().setVertexRenderer(new MyRenderer());

		// The following code adds capability for mouse picking of vertices/edges. Vertices can even be moved!
		final DefaultModalGraphMouse<String,Number> graphMouse = new DefaultModalGraphMouse<String,Number>();
		vv.setGraphMouse(graphMouse);
		graphMouse.setMode(ModalGraphMouse.Mode.PICKING);

		JFrame frame = new JFrame();
		frame.getContentPane().add(vv);
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.pack();
		frame.setVisible(true);
	}

	static class MyRenderer implements Renderer.Vertex<String, String> {
		@Override public void paintVertex(RenderContext<String, String> rc,
				Layout<String, String> layout, String vertex) {
			GraphicsDecorator graphicsContext = rc.getGraphicsContext();
			Point2D center = layout.transform(vertex);
			Shape shape = null;
			Color color = null;
			if(vertex.equals("Square")) {
				shape = new Rectangle((int)center.getX()-10, (int)center.getY()-10, 20, 20);
				color = new Color(127, 127, 0);
			} else if(vertex.equals("Rectangle")) {
				shape = new Rectangle((int)center.getX()-10, (int)center.getY()-20, 20, 40);
				color = new Color(127, 0, 127);
			} else if(vertex.equals("Circle")) {
				shape = new Ellipse2D.Double(center.getX()-10, center.getY()-10, 20, 20);
				color = new Color(0, 127, 127);
			}
			graphicsContext.setPaint(color);
			graphicsContext.fill(shape);
		}
	}
}

And the results are favorable:

P.D: Yes, I know that the code is ugly, is not OO, has numbers instead of constants, etc… I have no good excuse.

The source code for this example can be found here.

Learning JUNG (2) – Adding labels

That was very easy. First I changed the VisualizationImageServer for a VisualizationViewer. The name of the variable was also changed from vs to vv. The new class is the one used in all the JUNG examples, therefore it is probably better (talk about programming by coincidence). After doing this, I added the following lines after the creation of the VisualizationViewer:

Transformer transformer = new Transformer() {
  @Override public String transform(String arg0) { return arg0; }
};
vv.getRenderContext().setVertexLabelTransformer(transformer);
transformer = new Transformer() {
  @Override public String transform(String arg0) { return arg0; }
};
vv.getRenderContext().setEdgeLabelTransformer(transformer);

Transformer is an apache commons collections library that simply defines a one-way transformation between objects of two types (why isn’t this part of the standard Java libraries???). After defining the Transformer, it is added to the visualization engine using the specified functions. While my example is pretty simple, you can create more complex transformations the same way, and the edge and vertex transformations are independent.

Coming next (hopefully without much delay): changing the vertex’s shape.

Learning JUNG – Java Universal Network/Graph Framework

I’m searching for “user-friendly” java graph frameworks for an application that I’m developing for my studies. I stumbled upon JUNG. After 15 minutes searching and reading, I managed to create a directed graph and show it on screen.

package com.vainolo;

import java.awt.Dimension;
import javax.swing.JFrame;
import edu.uci.ics.jung.algorithms.layout.CircleLayout;
import edu.uci.ics.jung.graph.DirectedSparseGraph;
import edu.uci.ics.jung.visualization.VisualizationImageServer;

public class JungLearning {
  public static void main(String[] args) {
    DirectedSparseGraph g = new DirectedSparseGraph();
    g.addVertex("Vertex1");
    g.addVertex("Vertex2");
    g.addVertex("Vertex3");
    g.addEdge("Edge1", "Vertex1", "Vertex2");
    g.addEdge("Edge2", "Vertex1", "Vertex3");
    g.addEdge("Edge3", "Vertex3", "Vertex1");
    VisualizationImageServer vs =
      new VisualizationImageServer(
        new CircleLayout(g), new Dimension(200, 200));

    JFrame frame = new JFrame();
    frame.getContentPane().add(vs);
    frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
    frame.pack();
    frame.setVisible(true);
  }
}

And this is the output graph:

You can fetch this example’s code here

Next step: Try to show labels and try to change the vertex shapes.