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

Message ListMessage List     Post MessagePost Message

  Multi stacked bars and clumsy legend
Posted by Kim Ly on Oct-05-2013 05:52
Attachments:
Hello,

I am working on displaying a group of 9 release windows (9 bars), and 7 data sets (7
components each bar).
1. Is there a way to display only 7 {dataSetName} instead of 9x7 times in the legend?
2. Is there a way to remove 0 data in each group of data? That means there will be
different number of bars for each group.

P.S.: I'm using php.
Sorry if I repeat the questions, I didn't have time to research on 2)
And thank you for such a great tool.
clumsyLegend.PNG

  Re: Multi stacked bars and clumsy legend
Posted by Peter Kwan on Oct-08-2013 00:30
Attachments:
Hi Kim,

1. One simply method is to disable the automatic legend entries using Layer.setLegendOrder and then add the legend entries with your own code using LegendBox.addKey.

2. To have different number of bars in each group, you would need to put each group into a separate bar layer.

I have attached an example that demonstrates how to perform (1) and (2).

Hope this can help.

Regards
Peter Kwan
multistackbar.png
multistackbar.php
<?php
require_once("../lib/phpchartdir.php");

# The data for the bar chart
$data0 = array(44, 55, 100, 111);
$data1 = array(97, 87, 167, 222);
$data2 = array(156, 78, 147, 33);
$data3 = array(125, 0, 211, 235);
$data4 = array(44, 0, 100, 22);
$data5 = array(97, 0, 167, 7);
$data6 = array(156, 0, 0, 186);
$data7 = array(125, 118, 0, 0);
$data8 = array(44, 55, 0, 54);


# The labels for the bar chart. The labels contains embedded images as icons.
$labels = array("QQQQ", "WWWW", "RRRR", "TTTT");

# Create a XYChart object of size 600 x 350 pixels, using 0xe0e0ff as the background
# color, 0xccccff as the border color, with 1 pixel 3D border effect.
$c = new XYChart(600, 350, 0xe0e0ff, 0xccccff, 1);

#Set directory for loading images to current script directory
#Need when running under Microsoft IIS
$c->setSearchPath(dirname(__FILE__));

# Add a title to the chart using 14 points Times Bold Itatic font and light blue
# (0x9999ff) as the background color
$textBoxObj = $c->addTitle("Business Results 2001 vs 2002", "timesbi.ttf", 14);
$textBoxObj->setBackground(0x9999ff);

# Set the plotarea at (60, 45) and of size 500 x 210 pixels, using white (0xffffff)
# as the background
$c->setPlotArea(60, 45, 500, 210, 0xffffff);

# Swap the x and y axes to create a horizontal bar chart
$c->swapXY();

# Add a title to the y axis using 11 pt Times Bold Italic as font
$c->yAxis->setTitle("Revenue (millions)", "timesbi.ttf", 11);

# Set the labels on the x axis
$c->xAxis->setLabels($labels);

# Disable x-axis ticks by setting the tick length to 0
$c->xAxis->setTickLength(0);

# Add a stacked bar layer to the chart
for ($i = 0; $i < count($data0); ++$i)
{
	$layer = $c->addBarLayer2(Stack);
	$barCount = 0;

	# Add the first two data sets to the chart as a stacked bar group
	$layer->addDataGroup("2001");
	if (($data0[$i] != 0) || ($data1[$i] != 0) || ($data2[$i] != 0))
	{
		$layer->addDataSet(array_reverse(array_pad(array($data0[$i]), $i + 1, NoValue)), 0xff6666, "AAA");
		$layer->addDataSet(array_reverse(array_pad(array($data1[$i]), $i + 1, NoValue)), 0x6666ff, "BBB");
		$layer->addDataSet(array_reverse(array_pad(array($data2[$i]), $i + 1, NoValue)), 0x66ff66, "CCC");
		++$barCount;
	}
	
	# Add the remaining data sets to the chart as another stacked bar group
	if (($data3[$i] != 0) || ($data4[$i] != 0) || ($data5[$i] != 0))
	{
		$layer->addDataGroup("2002");
		$layer->addDataSet(array_reverse(array_pad(array($data3[$i]), $i + 1, NoValue)), 0xff6666, "DDD");
		$layer->addDataSet(array_reverse(array_pad(array($data4[$i]), $i + 1, NoValue)), 0x6666ff, "EEE");
		$layer->addDataSet(array_reverse(array_pad(array($data5[$i]), $i + 1, NoValue)), 0x66ff66, "FFF");
		++$barCount;
	}
	
	if (($data6[$i] != 0) || ($data7[$i] != 0) || ($data8[$i] != 0))
	{
		$layer->addDataGroup("2003");
		$layer->addDataSet(array_reverse(array_pad(array($data6[$i]), $i + 1, NoValue)), 0xff6666, "GGG");
		$layer->addDataSet(array_reverse(array_pad(array($data7[$i]), $i + 1, NoValue)), 0x6666ff, "HHH");
		$layer->addDataSet(array_reverse(array_pad(array($data8[$i]), $i + 1, NoValue)), 0x66ff66, "III");
		++$barCount;
	}
	
	$layer->setBarGap(1 - (0.8 * $barCount / 3), TouchBar);
	$layer->setAggregateLabelFormat("Year {dataGroupName}");
	$layer->setAggregateLabelStyle("arialbi.ttf", 8);
	$layer->setLegendOrder(NoLegend);
}

# Reverse 20% space at the right during auto-scaling to allow space for the aggregate
# bar labels
$c->yAxis->setAutoScale(0.2);

# Add a legend box at (310, 300) using TopCenter alignment, with 2 column grid
# layout, and use 8 pts Arial Bold Italic as font
$legendBox = $c->addLegend2(310, 300, false, "arialbi.ttf", 8);
$legendBox->setAlignment(TopCenter);
$legendBox->addKey("AAA", 0xff6666);
$legendBox->addKey("BBB", 0x6666ff);
$legendBox->addKey("CCC", 0x66ff66);

# Set the format of the text displayed in the legend box
$legendBox->setText("Year {dataGroupName} {dataSetName} Revenue");

# Set the background and border of the legend box to transparent
$legendBox->setBackground(Transparent, Transparent);

# Output the chart
header("Content-type: image/png");
print($c->makeChart2(PNG));
?>

  Re: Multi stacked bars and clumsy legend
Posted by Kim Ly on Oct-11-2013 01:55
Hi Peter,

That greatly helped. Thanks a lot.

Now another problem arises that for each release window (each bar) there is a number of
release engineers working on that window. So for each bar I will have one data point. Those
data points will form a line graph.

I am still scratching my head on how to put a line graph over a multi stacked bar graph.

  Re: Multi stacked bars and clumsy legend
Posted by Peter Kwan on Oct-12-2013 00:50
Hi Kim,

I am not too sure how you would like to connect the data points on the bars. Do you want to draw one line that connects the data points on all the bars? Because you may have different number of bars in each group, so the connection would be rather random. It is like:

Windows AAA (08/26/2003)
Windows BBB (08/26/2003)
Windows EEE (08/26/2003)
Windows QQQ (08/26/2003)
Windows CCC (09/02/2003)
Windows PPP (09/02/2003)
Windows BBB (09/09/2003)
Windows FFF (09/09/2003)
Windows QQQ (09/09/2003)

Note that the AAA BBB EEE ... can be rather random (because some bars are missing) and each date and can different number of bars. Because each bar group (the bars with the same date) can be different from another bar group, when they are joined together, it would be hard to interpret what it means.

Anyway, if you would like to draw the line, the easiest method for your case is to provide the (x, y) coordinates for the points on the line, and add it as a LineLayer. I think you already know what is the y-coordinates (the data value of the bar). For the x-coordinates, the tick position of the x-axis labels are at x = 0, 1, 2, 3, .....  So if you want the point to appear in the same position as the tick, you may use x = 0, 1, 2, 3 ... If you want the point to shift, you may add a fractional number, like x = -0.3, 0, 0.3, 0.7, 1, .....

Hope this can help.

Regards
Peter Kwan

  Re: Multi stacked bars and clumsy legend
Posted by Kim Ly on Oct-12-2013 05:47
yes, I would need to draw each point on each bar (except bars of value 0, data point will also be 0)
Your suggesstion sounds good, I will try it out.

Appreciate it alot.