ASE Home Page Products Download Purchase Support About ASE
ChartDirector Support
 Forum HomeForum Home   SearchSearch

Message ListMessage List     Post MessagePost Message

  LineLayer and Percentages
Posted by John Nelson on Dec-14-2017 04:07
| Reply | Monitor
Hi - I have a series of charts that users can choose from - currently bar and line charts.  There are 3 data sets that are used to create each one.  For the bar chart I use

layer = (BarLayer)c.addBarLayer2(Chart.Percentage);

and that creates a nice stacked bar chart with the percentages.

I also use

layer = (BarLayer)c.addBarLayer2(Chart.Stack);

and that creates a nice stacked bar chart with the actual values in the data set.

Seeing that a stacked bar chart and a line chart with multiple data sets are basically 2 ways to view the same data...

I am wondering if there is a way to have my line chart show the percentage data as well.

I tried

Layer layer = (LineLayer)c.addLineLayer2();
layer.setDataCombineMethod(Chart.Percentage);

            layer.addDataSet(red, getHighLevelColor(), "High");
            layer.addDataSet(yellow, getMidLevelColor(), "Medium");
            layer.addDataSet(green, getLowLevelColor(), "Low");

Any help with line charts showing the sme percentage values as the bar charts?

  Re: LineLayer and Percentages
Posted by Peter Kwan on Dec-14-2017 16:23
| Reply | Monitor
Hi John,

For line charts, there is no "stacked" type data combine method (including the percentage method). If you need this style, you can compute the percentage with your own code, which should not be difficult with the ArrayMath library. May be you can try:

double[] total = new ArrayMath(red).add(yellow).add(green).result();
double[] greenPercentage = new ArrayMath(green).financeDiv(total, 1.0/3).mul(100).result();
double[] yellowPercentage = new ArrayMath(yellow).financeDiv(total, 2.0/3).mul(100).add(greenPercentage).result();
double[] redPercentage = new ArrayMath(total).financeDiv(total, 1).mul(100).result();

Now you can use the greenPercentage, yellowPercentage and redPercentage to plot the line chart.

Note that for the percentage chart, there is always the undefined case with invalid data (the red/yellow/green are all zero at a certain position). In the above code, if the red/yellow/green are of the same value, then each is assumed to be 33.33% of the total, even if all of them are 0 (they are still the same value).

Hope this can help.

Regards
Peter Kwan

  Re: LineLayer and Percentages
Posted by John Nelson on Dec-14-2017 22:49
| Reply | Monitor
This is the code that I used…

            double[] total = new ArrayMath(red).add(yellow).add(green).result();
            double[] greenPercentage = new ArrayMath(green).financeDiv(total, 1.0/3).mul(100).result();
            double[] yellowPercentage = new ArrayMath(yellow).financeDiv(total, 1.0/3).mul(100).result();
            double[] redPercentage = new ArrayMath(red).financeDiv(total, 1.0/3).mul(100).result();

            if (representation.contains("percent"))
            {
                layer.addDataSet(redPercentage, project.getHighLevelColor(), "High");
                layer.addDataSet(yellowPercentage, project.getMidLevelColor(), "Medium");
                layer.addDataSet(greenPercentage, project.getLowLevelColor(), "Low");
            }

Thank you for you support – it really helped.

One further question.

The percentages show up in the line graphs – but the values have too many decimal places (6 places seems to be the default) and the values run into each other on the chart.  Is there a way to round or truncate each element in the array to 2 decimal places?

Thanks

  Re: LineLayer and Percentages
Posted by John Nelson on Dec-14-2017 23:55
| Reply | Monitor
If there is not a round method I used this little algorithm to round each element...

            for(int per =0; per < greenPercentage.length; per++)
                greenPercentage[per] = Math.round(greenPercentage[per]*100.0)/100.0;

  Re: LineLayer and Percentages
Posted by John Nelson on Dec-15-2017 05:17
| Reply | Monitor
One more question.  I think I have the percentage array data working.

Now I want the y-axis to display from 0%-100% with these new datasets.

I tried c.yAxis().setLogScale(0.0, 100.0); but that made the y-axis 0-100 with the tick marks of 0, 0.1, 1, 10, and 100

Is there any way to get the tick marks to display 0%-100% with all the percentages labeled
100%
90%
80%
70%
60%
50%
40%
30%
20%
10%
0%

?

  Re: LineLayer and Percentages
Posted by Peter Kwan on Dec-15-2017 12:44
| Reply | Monitor
Hi John,

For the axis scale, you can use Axis.setLinearScale instead of Axis.setLogScale. (The latter is for logarithmic scale.)

c.yAxis().setLinearScale(0, 100, 10);

// Add a percentage sign after the label value
c.yAxis().setLabelFormat("{value}%");

For data labels with 2 decimal places, you can use:

// Two decimal places, and put a percentage sign afterwards.
layer.setDataLabelFormat("{value|2}%");

Hope this can help.

Regards
Peter Kwan