[Solved] How to Change Style Chart to 2D stacked bar

[Watit]

I see this "http://demos.telerik.com/silverlight/#Chart/Gallery/StackedBar"  

 2D stacked bar Horizontal

But I can't Change my chart  to That Style , i don't know to use code to change chart style 2D stacked bar Horizontal
 .
How To Use code in XAML or Code Behind?
Help me please!.

     <UserControl.Resources>

      <telerik:SeriesMappingCollection x:Key="HorizontalMappings">
          <telerik:SeriesMapping LegendLabel="Stacked Bar 1" CollectionIndex="0">
              <telerik:SeriesMapping.SeriesDefinition>
                  <telerik:HorizontalStackedBarSeriesDefinition StackGroupName="Stack1" />
              </telerik:SeriesMapping.SeriesDefinition>
              <telerik:ItemMapping DataPointMember="YValue" />
          </telerik:SeriesMapping>
          <telerik:SeriesMapping LegendLabel="Stacked Bar 2" CollectionIndex="1">
              <telerik:SeriesMapping.SeriesDefinition>
                  <telerik:HorizontalStackedBarSeriesDefinition StackGroupName="Stack1" />
              </telerik:SeriesMapping.SeriesDefinition>
              <telerik:ItemMapping DataPointMember="YValue" />
          </telerik:SeriesMapping>
          <telerik:SeriesMapping LegendLabel="Stacked Bar 3" CollectionIndex="2">
              <telerik:SeriesMapping.SeriesDefinition>
                  <telerik:HorizontalStackedBarSeriesDefinition StackGroupName="Stack1" />
              </telerik:SeriesMapping.SeriesDefinition>
              <telerik:ItemMapping DataPointMember="YValue" />
          </telerik:SeriesMapping>
          <telerik:SeriesMapping LegendLabel="Stacked Bar 4" CollectionIndex="3">
              <telerik:SeriesMapping.SeriesDefinition>
                  <telerik:HorizontalStackedBarSeriesDefinition StackGroupName="Stack2" />
              </telerik:SeriesMapping.SeriesDefinition>
              <telerik:ItemMapping DataPointMember="YValue" />
          </telerik:SeriesMapping>
          <telerik:SeriesMapping LegendLabel="Stacked Bar 5" CollectionIndex="4">
              <telerik:SeriesMapping.SeriesDefinition>
                  <telerik:HorizontalStackedBarSeriesDefinition StackGroupName="Stack2" />
              </telerik:SeriesMapping.SeriesDefinition>
              <telerik:ItemMapping DataPointMember="YValue" />
          </telerik:SeriesMapping>
      </telerik:SeriesMappingCollection>

  </UserControl.Resources>

<telerik:RadChart Grid.Row="3" Height="133" HorizontalAlignment="Left" Margin="12,11,0,0"  Name="radChartDetail" VerticalAlignment="Top" Width="515" Grid.RowSpan="2" SeriesMappings="{StaticResource HorizontalMappings}">
 <telerik:RadChart.DefaultView>
              <telerik:ChartDefaultView>
                  <telerik:ChartDefaultView.ChartLegend>
                      <telerik:ChartLegend Visibility="Collapsed"/>
                  </telerik:ChartDefaultView.ChartLegend>
              </telerik:ChartDefaultView>
          </telerik:RadChart.DefaultView>
      </telerik:RadChart>

  #region |"Set Value Label Percent"|
            labelWithValue1.Valuetext = "2001";
            labelWithValue2.Valuetext = "28.50";
            labelWithValue3.Valuetext = "28.75";
            labelWithValue4.Valuetext = "4676";

            #region |"DataPercent"|
            List<Double> DataPercent = new List<Double>();
                DataPercent.Add(Convert.ToDouble(labelWithValue1.Valuetext));
                DataPercent.Add(Convert.ToDouble(labelWithValue4.Valuetext));
                DataPercent.Add(Convert.ToDouble(labelWithValue2.Valuetext));
                DataPercent.Add(Convert.ToDouble(labelWithValue3.Valuetext));

                this.radChartDetail.SeriesMappings = this.Resources["HorizontalMappings"] as SeriesMappingCollection;
                radChartDetail.ItemsSource = DataPercent.ToArray();
            #endregion |"End DataPercent"|

#endregion |"End Set Value Label Percent"|

Thank You

[Sia]

Hello Watit,

What do you mean by styling  "2D stacked bar Horizontal"? Do you need the look from the mentioned example - to achieve it, just set our Metro theme to your application.

All the best,
Sia
the Telerik team

[Watit]

I mean need to use style Chart to 2D stacked bar Horizontal.
That i can't  make it with that my code

And what does it mean about " the mentioned example"? Where i found them?

Thank you

[Sia]

Hi Watit,

Please check the attached solution where the same approach as the one in our demo is used.
I hope this helps.

Kind regards,
Sia
the Telerik team