Simple stacked bar example

[ebaker]

Can someone please give me a simple example on how  to make a horizontal stacked bar chart? I'm finding it very difficult to grasp the charting controls, and I'm under a tight deadline at the moment. I just need a single horizontal bar (not 3D) with 3 stacks colored green, red, and gray. I can get 3 separate bars to display, but I can't stack them into a single bar. What am I missing? If someone can throw together a few lines of code to show me an example, that would be very helpful.

Thanks,
Eric

[Evgenia]

Hi Eric,

This is a sample of Horizontal Stacked Bar made of three Series as you requested.

<my:RadChart x:Name="radChart1">
           <my:RadChart.DefaultView>
               <Charting:ChartDefaultView>
                   <Charting:ChartDefaultView.ChartArea>
                       <Charting:ChartArea>
                           <Charting:ChartArea.DataSeries>
                               <!-- Series 1 -->
                               <Charting:DataSeries LegendLabel="Series 1">
                                   <Charting:DataSeries.Definition>
                                       <Charting:HorizontalStackedBarSeriesDefinition>
                                       </Charting:HorizontalStackedBarSeriesDefinition>
                                   </Charting:DataSeries.Definition>
                                   <Charting:DataPoint YValue="20"/>
                               </Charting:DataSeries>
                               <!-- Series 2 -->
                               <Charting:DataSeries LegendLabel="Series 2">
                                   <Charting:DataSeries.Definition>
                                       <Charting:HorizontalStackedBarSeriesDefinition>
                                       </Charting:HorizontalStackedBarSeriesDefinition>
                                   </Charting:DataSeries.Definition>
                                   <Charting:DataPoint YValue="10"/>
                               </Charting:DataSeries>
                               <!-- Series 3 -->
                               <Charting:DataSeries LegendLabel="Series 3">
                                   <Charting:DataSeries.Definition>
                                       <Charting:HorizontalStackedBarSeriesDefinition>
                                       </Charting:HorizontalStackedBarSeriesDefinition>
                                   </Charting:DataSeries.Definition>
                                   <Charting:DataPoint YValue="40"/>
                               </Charting:DataSeries>
                           </Charting:ChartArea.DataSeries>
                       </Charting:ChartArea>
                   </Charting:ChartDefaultView.ChartArea>
               </Charting:ChartDefaultView>
           </my:RadChart.DefaultView>
       </my:RadChart>

 
Additionally you can set custom color for each Series as shown in this help topic - http://www.telerik.com/help/silverlight/radchart-styling-and-appearance-styling-chart-series.html

Hope this helps.

Best wishes,
Evgenia
the Telerik team

[ebaker]

Thanks! That was exactly what I needed.

Eric

[Abhishek]

Hi,
I have some other problems. I have to place 4 checkboxes on the chart as I have 4 series in a single stack bar. Now when i want to do filtering through the check boxes, as depending on the boxes to be checked the graph would show only those serieses.

Please give me some idea.

Thank you.

[Evgenia]

Hi Abhishek,

Take a look at our demo with source code that will help you achieve your scenario.

Kind regards,
Evgenia
the Telerik team

[Ammar]

What is namespace "my:" is referring to ? ,in the example you posted.

[Evgenia]

Hello Eric,

I was not able to find the namespace you mentioned in the source code of the demo. Are we looking at one and the same online example? I would be helpful if you could send us a code snippet where this namespace is used.

Let me know if you need a runnable version of one of our online demos and we'll provide it.

Regards,
Evgenia
Telerik