Custom Node Graphics

In versions of Cytoscape prior to 2.3 it was possible to create custom nodes (such as "pie nodes") using the underlying Piccolo architecture. In Cytoscape 2.3, with the introduction of a new rendering engine, the underlying Piccolo dependencies have been pulled out and it is no longer possible to create custom nodes using Piccolo. To make up for this shortcoming in 2.3, a simple makeshift API has been assembled to provide plugin writers the ability to once again create custom nodes. Of course, the new way of creating custom nodes is done through an API that is in no way related to the old method of making custom nodes; plugins that created custom nodes in prior versions of Cytoscape will need to be modified.

This new API consists of the ability to define an arbitrary number of specified shapes filled with specified paint on a node view. These shapes will be rendered relative to the node's center. The edge intersection computations for the node will still rely on the overall node's shape, which is independent of the custom graphic shapes specified. One strategy might be to define a node shape as rectangle, filled with completely transparent color, with no node border; then specify custom graphics that fit inside of the specified rectangular shape. Then edges would still be computed based on the outer [invisible] rectangular boundary.

Custom node graphics are not saved in Cytoscape session files or in any of the network file formats such as XGMML.

To get started, first obtain an instance of giny.view.NodeView in the usual manner. But from here on things will be different from previous versions of Cytoscape. Cast this NodeView object to an instance of ding.view.DNodeView. Then apply the methods documented below.

Here is some sample code (sample_code_userland_notes) that demonstrates basic principles. This code would generate custom node graphics that looked like this:

   1 java.awt.geom.Rectangle2D rect =
   2   new java.awt.geom.Rectangle2D.Double(-11.0, -15.0, 22.0, 30.0);
   3 java.awt.Paint paint = null;
   4 try {
   5   paint = new java.awt.TexturePaint
   6     (javax.imageio.ImageIO.read
   7      (new java.net.URL("http://cytoscape.org/people_photos/mike.jpg")),
   8      rect); }
   9 catch (Exception exc) {
  10   paint = java.awt.Color.black; }
  11 giny.view.NodeView nv;
  12 // Obtain an instance of NodeView using documented Cytoscape API.
  13 ....
  14 ding.view.DNodeView dnv = (ding.view.DNodeView) nv;
  15 dnv.addCustomGraphic(rect, paint, cytoscape.render.stateful.NodeDetails.ANCHOR_WEST);
  16 

Methods below are defined on an instance of ding.view.DNodeView.

getCustomGraphicCount

public int getCustomGraphicCount()

Returns the number of custom graphic objects currently set on this node view.

getCustomGraphicShape

public java.awt.Shape getCustomGraphicShape(int index)

Returns the shape of the custom graphic object at specified index on this node view. The index parameter must be in the range [0, getCustomGraphicCount()-1].

getCustomGraphicPaint

public java.awt.Paint getCustomGraphicPaint(int index)

Returns the paint on the custom graphic object at specified index on this node view. The index parameter must be in the range [0, getCustomGraphicCount()-1].

removeCustomGraphic

public void removeCustomGraphic(int index)

Removes the custom graphic object at specified index. The index parameter must be in the range [0, getCustomGraphicCount()-1]. Once the object at specified index is removed, all objects remaining and at a higher index will be shifted such that their index is decreased by one.

addCustomGraphic

public void addCustomGraphic(java.awt.Shape s, java.awt.Paint p, int index)

Adds a custom graphic object at specified index. The index of an object is only important in that objects with lower index are rendered before objects with higher index; if objects overlap, this order may be important to consider. A custom graphic object consists of the specified shape that is filled with the specified paint; the shape is placed relative to this node's location.