Modifying a Chart Element using API Functions

The Chart API provides access to charting engine commands using Java object syntax. You can use these commands to directly modify the graphical elements displayed by a Chart.

In this example, you will first create a chart by using the 'Data Binding' dialog box. You will then make further modifications to the display by using Chart API commands. Follow the steps below:

1. Add a new Chart element to the report.

2. Right-click the chart, and select 'Bind Data' from the context menu. This opens the 'Data Binding' dialog box.

3. Under the Data tab, select the 'All Sales' query.

4. Click the Chart tab. From the 'Available Columns' panel, drag the 'Employee' field to the 'X' region of the 'Data' panel.

#1 Ranking: Read how InetSoft was rated #1 for user adoption in G2's user survey-based index Read More

5. Bind the 'Total' field so as to provide three different measures on the chart. Follow the steps below:

a. From the 'Available Columns' panel, drag the 'Total' field to the 'Y' region of the 'Data' panel.

b. Click the 'Edit Measure' button next to the 'Total' field. Set the 'Aggregate' to 'Max', and click the green 'Apply' button.

c. From the 'Available Columns' panel, drag the 'Total' field (again) to the 'Y' region of the 'Data' panel.

d. Click the 'Edit Measure' button next to the second 'Total' field. Set the 'Aggregate' to 'Min', and click the green 'Apply' button.

e. From the 'Available Columns' panel, drag the 'Total' field (again) to the 'Shape' region of the 'Visual' panel.

f. Click the 'Edit Measure' button next to the third 'Total' field. Set the 'Aggregate' to 'Average', and click the green 'Apply' button.

6. Click the 'Select Chart Style' button. Double-click to select the Point Style chart.

7. The 'Data Binding' dialog box should now appear as below:

8. Click 'Finish' to close the 'Data Binding' dialog box. Preview the report.

The chart shows maximum and minimum totals for each employee, and the chart shape-coding (interior fill) displays the average totals.

Note that the interior fill, 'Average(Total)', is the same for both datasets, so it is not needed in both locations. In the next steps, you will change the 'Min(Total)' markers to a solid red arrow-shape. You will also increase the size of the 'Max(Total)' markers so that the fill level is more visible. To make these changes, you will use the Chart API functions.

Note: Chart API script (which operates on the Chart's 'Egraph' property) should be placed in element scope. See Adding Element-Level Script for more information.

9. Create the required StaticShapeFrame, StaticColorFrame, and StaticSizeFrame objects.

// Import required Java packages:
importPackage(inetsoft.graph.aesthetic);
 
// Create arrow-shaped markers:
var shpframe = new StaticShapeFrame(GShape.ARROWBAR);
 
// Create static red color:
var colframe =
   new StaticColorFrame(java.awt.Color(0xFF0000));
 
// Create static size of 10 pixels:
var sizframe = new StaticSizeFrame(10);

10. Obtain a handle to each of the two datasets (element sets) by using the EGraph.getElement(index) method.

 var elem0 = graph.getElement(0); // Max point element
 var elem1 = graph.getElement(1); // Min point element 

11. Assign the visual frames to the appropriate data elements using the element's GraphElement.setShapeFrame(frame), GraphElement.setColorFrame(frame), and GraphElement.setSizeFrame(frame) properties.

elem1.shapeFrame = shpframe; // Min point element 
elem1.colorFrame = colframe; // Min point element 
elem0.sizeFrame = sizframe; // Max point element 

12. Close the Script Editor, and preview the report. The complete script is shown below, along with the resulting graph.

importPackage(inetsoft.graph.aesthetic);
var shpframe = new StaticShapeFrame(GShape.ARROWBAR);
var colframe =
   new StaticColorFrame(java.awt.Color(0xFF0000));
var sizframe = new StaticSizeFrame(10);
var elem0 = graph.getElement(0); // Max point element
var elem1 = graph.getElement(1); // Min point element
elem1.shapeFrame = shpframe;
elem1.colorFrame = colframe;
elem0.sizeFrame = sizframe;
Read the top 10 reasons for selecting InetSoft as your BI partner.

More Articles About Charting

Applying BI to a Higher Education Fundraising Call Center - So as we move into the demo, we are going to look at a call center system where there is a set of data tables. There are call records which are coming from the call system pictured by these blue cubes. There is alumni data. This is a higher education fundraising call center with a set of tables represented by the green cubes. There might be e-mail appeals going out to the same people represented by the orange cubes coming from a marketing system. They use students for callers, and all of the student information is in another system, the registration enrollment system...

Control a Chart Visual Properties - You can control the visual properties (font, alignment, background, etc.) of expanding cells, rows, and columns in the formula table script for your chart. There are three general steps: 1. Call functions to modify the visual properties of the "pre-expansion" table. 2. Call the "expandCalcTable()" function to expand formula table. 3. Call functions to modify the visual properties of the "post-expansion" table...

Collection of Best Dashboard Design Examples - Why is it important to find out what makes the best dashboard design? A well-designed dashboard is easy on the eyes and allows users to quickly observe trends and correlations in their data. While designers can often fall for the temptation to overload their dashboards with too many elements, a crisp and efficient organization of KPI's will save the end users time and reduce mental strain in performing data analysis...

Evaluate InetSoft's InfluxDB Dashboard Solution - Are you looking for a good InfluxDB dashboard solution? InetSoft's pioneering dashboard reporting application produces great-looking web-based dashboards with an easy-to-use drag-and-drop designer. Get cloud-flexibility for your deployment. Minimize costs with a small-footprint solution. Maximize self-service for all types of users. No dedicated BI developer required. View a demo and try interactive examples...

Why InetSoft for Your Sales KPI Dashboard? - Through the built-in interactivity and flexibility of InetSoft's dashboard software for data analysis, KPI dashboards are easy to build. In a sales dashboard, a further analysis of pipeline performance that allows for the breaking down of where sales tend to drop, how often, and other factors is useful for a sales manager or team member. InetSoft is easier to use in comparison to other dashboard solutions. Sale teams are able to get their platforms up and running in weeks, not months. Self service is a major attraction for most sale teams because the constant dependency on IT is no longer an issue...

Previous: Modifying a Chart Data Binding