please check the following sample code:
Code: Select all
<!DOCTYPE html>
<head>
<title>Stacked Bars</title>
<script src="https://www.steema.com/files/public/teechart/html5/latest/src/teechart.js" type="text/javascript"></script>
<script type="text/javascript">
function draw() {
var Chart1=new Tee.Chart("Canvas1");
Chart1.title.text="Stacked Bars";
var Series1=Chart1.addSeries(new Tee.Area());
Series1.title="Series1";
Series1.data.values=[192,72,24,12];
Series1.data.x=[1,2,3,4];
Series1.stacked="no";
var Series2=Chart1.addSeries(new Tee.Bar());
Series2.title="Series2";
Series2.data.values=[60,72,24,5];
Series2.data.x=[1,2,3,4];
Series2.stacked="yes";
var Series3=Chart1.addSeries(new Tee.Bar());
Series3.title="Series3";
Series3.data.values=[192,119,48,24];
Series3.data.x=[1,2,3,4];
Series3.stacked="yes";
Chart1.draw();
}
</script>
</HEAD>
<BODY onload="draw()">
<canvas id="Canvas1" width="800" height="600">
This browser does not seem to support HTML5 Canvas.
</canvas>
</BODY>
</HTML>
- the bars are using the Series1 for stacking even if it is not stacked,
- changing the create order of the series (Series2, Series3, Series1) solves the problem, but the Series1 should be in the "background".
How can I avoid this behaviour?
Thanks in advance,
MS
