ChartsPLUS 3.0 offers the ability to customize charts at runtime. In addition to having the ability to select standard charts from a chart picker ChartsPLUS also offers a powerful Combination Chart Wizard and Chart Editor to customizing chart properties at runtime.

In this blog we look at how we can convert a simple column chart into a stacked column, line dual axes chart.

In this example we will creating a combination chart to compare Sales, Costs (multiple measures: Storage Cost, Transportation Cost and COGS) and Gross Margin %.

You can view an online demo below:


Below is the screenshot of the data source, we have the following measures: Gross Sales, Storage Cost, Transportation Cost, COGS (Cost) and Gross Margin%. For this demo purpose we want to have the Sales measure in one column, all the Cost measures stacked in a second column and the Gross Margin % as a line on the second axes (%).



Add ChartsPLUS to the application layout, under the Additional Properties of the Chart, go to General>>Chart Menu>>Chart Menu and toggle the Enabled value ON under General properties.  This property enables the Chart Menu at run time.


The chart initially appears as below:




Observe the new Chart Menu button option available to us on the Top-left hand side of the application. To convert this chart into a Combination chart we select this button and go to Chart Menu>>Chart Type>>Combination…



In the Chart Preview popup toggle ON the Stackable property of the Storage, Transport and COGS graphs, this will set all the Cost Measures as a new stacked column. Toggle the Secondary Axis property of Gross Margin% to ON and set the Chart Type to Line.



Click Apply. This ensures all the Cost graphs are in a stacked column along with the Sales column, while the Gross Margin% is represented in the same Chart on a separate axis. The chart now looks something like:



Modifying Chart Editor Properties:

Once again select the Chart Menu button and go to Chart Type>>Chart Editor. Under Graphs let us select the Gross Margin% graph to modify its properties.



Under Titles & Labels change the Title to ‘GM%‘. Toggle the Show Value Labels property to ON.



Also, under Value Axes select Secondary Axis and set its Title property to ‘Gross Margin%’. This serves to represent the fact that our Gross Margin% line graph is represented on a separate value axis. Click Apply.



Our resultant chart appears as follows:


You can request a trial version of ChartsPLUS from here.