Chart Scripting Tutorial (API)

This appendix provides a set of chart examples to illustrate some common chart scripting tasks, such as color-coding data, changing labels and axes, and positioning chart annotations.

The scripts in this appendix can be used for both Report Charts (using Report Designer) and Viewsheet Charts (using Visual Composer). However, there are some differences in how charts are configured in these different environments. See the references for further information.

Accessing Chart Data

You can access Chart data in script by using the “dataset” object. The dataset object contains the aggregate values displayed on the chart (the same values shown by the 'Chart Data' button). The Dataset object is accessible as a two-dimensional array, where each column represents a distinct dataset (measure).

For example, consider a chart with two datasets (measures), as shown below: As is typically the case, each value plotted on the graph represents an aggregation of many detail records. The Dataset object provides access to these aggregate values.

You can use the dataset.getdata(j,i) function with row index i and column j (an integer index, or the actual column name) to access the data displayed on the chart. Use dataset.getRowCount() and dataset.getColCount() to obtain the number of rows and columns of summarized data.

“We evaluated many reporting vendors and were most impressed at the speed with which the proof of concept could be developed. We found InetSoft to be the best option to meet our business requirements and integrate with our own technology.” - John White, Senior Director, Information Technology at Livingston International

Example: Accessing aggregate data

In this example, add a script to display data values on the chart only if the value exceeds falls below a threshold the measure.

1. Create a new Viewsheet based on the 'Sales' > 'Sales Explore' Worksheet.
2. Drag a Chart component onto the Viewsheet, and click the 'Edit' button on the Chart to open the Chart Editor.
3. Bind the 'Category' field to the chart's X-axis.
4. Bind both 'Total' and 'Quantity Purchased' fields to the chart's Y-axis. This creates a facet chart with two sets of axes.
5. Resize the chart to show all data.
6. Right-click on the chart, and select 'Properties' from the context menu. This opens the 'Chart Properties' dialog box. Add the following script in the 'Script' area.

importPackage(inetsoft.graph)
 importPackage(inetsoft.graph.data)
 importPackage(inetsoft.graph.guide.form)

   var threshold = 5000;

   // Step through the rows of chart data with index i for (var i = 0;
   i < dataset.getRowCount(); i++) {

   // Obtain the ith value of 'Category' and 'Quantity'
   var Xvalue = dataset.getData("Category", i);
   var Yvalue =   
   dataset.getData('Sum of Quantity Purchased', i);

   // test the value of Quantity against the threshold
   if(Yvalue < threshold) {

     // Create the label object
     var form = new LabelForm();
     // Set the label to appear only on Quantity axes
     form.setMeasure('Sum of Quantity Purchased')
     // Set the label text
     form.setLabel(Yvalue);
     // Set the label position and alignment
     form.setValues([Xvalue,Yvalue]);
     form.setAlignmentX(GraphConstants.CENTER_ALIGNMENT);
     // Add the label to the graph
     graph.addForm(form)
   }
 }