Changing the Appearance of a Dashboard Chart via the API

You can change the static appearance of dashboard chart elements by using a static VisualFrame. For example, you can set static colors, sizes, and textures to enhance the aesthetic appearance of a chart.

Consider the script below:

View 2-min Dashboard Demo
Register for Pricing
#1 Ranking: Read how InetSoft was rated #1 for user adoption in G2's user survey-based index Read More

 importPackage(inetsoft.graph)
 importPackage(inetsoft.graph.element)
 importPackage(inetsoft.graph.scale)
 importPackage(inetsoft.graph.aesthetic)
 importPackage(inetsoft.graph.data)
   var arr = [["State","Quantity","Total"],
            ["NJ",200,2500],["NY",300,1500]];
 dataset = new DefaultDataSet(arr);
 graph = new EGraph();
 var elem = new PointElement("State", "Quantity");
 graph.addElement(elem);

This creates a basic point (scatter) chart displaying the dimensions 'State' and 'Quantity'. However, the points are rather small and hard to see. To increase the size of the points and assign them a bolder color, use a StaticColorFrame and a StaticSizeFrame.

Follow these steps:

1. Create a new StaticColorFrame object, and specify a static color (red).

 var cframe = new StaticColorFrame(); 
 cframe.setColor(java.awt.Color(0xff0000));// red 

2. Create a new StaticSizeFrame object, and specify a static size.

 var sframe = new StaticSizeFrame(); 
 sframe.setSize(10); 

3. Assign the StaticColorFrame and StaticSizeFrame objects to the GraphElement

 object. elem.setColorFrame(cframe);
 elem.setSizeFrame(sframe);

The complete script is shown below. The points are now large and red.

 importPackage(inetsoft.graph)
 importPackage(inetsoft.graph.element)
 importPackage(inetsoft.graph.scale)
 importPackage(inetsoft.graph.aesthetic)
 importPackage(inetsoft.graph.data)
   var arr = [["State","Quantity","Total"],
            ["NJ",200,2500],["NY",300,1500]];
 dataset = new DefaultDataSet(arr);
 graph = new EGraph();
 var elem = new PointElement("State", "Quantity");
 var cframe = new StaticColorFrame();
 cframe.setColor(java.awt.Color(0xff0000));
 // red var sframe = new StaticSizeFrame();
 sframe.setSize(10);
 elem.setColorFrame(cframe);
 elem.setSizeFrame(sframe);
 graph.addElement(elem);

Because these are static VisualFrames, the color and size are not keyed to the data. To represent data values using color, size, or other visual attributes, see Representing Data with Shape, Color, Size.

Previous: Executive Dashboard API