How to Change Style Chart to 2D stacked bar

4 posts, 1 answers
  1. Watit
    Watit avatar
    37 posts
    Member since:
    Oct 2011

    Posted 05 Nov 2011 Link to this post

    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
  2. Sia
    Admin
    Sia avatar
    667 posts

    Posted 09 Nov 2011 Link to this post

    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

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. DevCraft banner
  4. Watit
    Watit avatar
    37 posts
    Member since:
    Oct 2011

    Posted 09 Nov 2011 Link to this post

    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


  5. Answer
    Sia
    Admin
    Sia avatar
    667 posts

    Posted 14 Nov 2011 Link to this post

    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

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

Back to Top