Z-Order

[Aymiee Lee]

I have a stacking column and a line chart. I would like the line chart to be on the foreground and stacking in the background. Does z-Order work with line chart?

I am unable to get the line chart to be on top (foreground)

[Manohari]

Hi Al,

Sorry for the delayed response. It is possible to Change the ZOrder of the series using the ChartSeries.ZOrder property as given below.

Example:

this.ChartWebControl1.Model.Series[0].ZOrder = 2; // Line series
this.ChartWebControl1.Model.Series[1].ZOrder = 1; // StackingColumn
this.ChartWebControl1.Model.Series[2].ZOrder = 0; // StackingColumn

I have attached the sample that illustrates the same this link below.

http://websamples.syncfusion.com/samples/Chart.Web/6.2.0.40/F74845_1/Sample.htm

But this property will not work with StackingColumn for Essential Studio versions lower than V6.2.0.40.

Could you please let us know the version you are currently using?

However, if you are using version before 6.2.0.40, it is possible to draw the Line above the stackingColumn by adding the LineChartSeries to the ChatrControl.Series Collection as first Series. By default, the Series are painted depending on the order they are added to the chart. i.e. series which is added to

the chart as first is painted as the outermost and the series which is added at the last is painted as the innermost.


Hence if the line chart is added to the chartControl.Series first it will be drawn above the stackingChart.

Example:

this.ChartWebControl1.Series.Add(lineSeries); // Will be painted as outermost series
this.ChartWebControl1.Series.Add(series2); //Will be painted in middle.
this.ChartWebControl1.Series.Add(series1); // Will be painted as the innermost Series

I have attached the sample that illustrates the same this link below.

http://websamples.syncfusion.com/samples/Chart.Web/5.2.0.25/F74845/Sample.htm

Kindly let us know if this meets your requirement. Thanks for your patience.

Regards,
Manohari.R