RadChart Legend issues

2 posts, 1 answers
  1. John Thompson
    John Thompson avatar
    44 posts
    Member since:
    Dec 2009

    Posted 23 Aug 2011 Link to this post

    Again, it's probably just me but I have a sample graph with two line charts displaying random data.  The first one does not have DefaultView definition changing axis formatting, limits and annotations and the second one does.  The legend in the second graph does not display except for the title.  I've pushed this one around all morning and I am not getting very far.  I have also attached a screen shot of the sample.

    I am in need of assistance!

    The Xaml:
    <UserControl
        x:Class="RadChartTest.MainPage"
        mc:Ignorable="d" d:DesignWidth="1024" d:DesignHeight="768">
     
        <Grid x:Name="LayoutRoot">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
     
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
     
            <telerik:RadChart x:Name="Without" Grid.Column="0" Grid.Row="0">
                <telerik:RadChart.SeriesMappings>
                    <telerik:SeriesMapping ItemsSource="{Binding Values}" LegendLabel="Average">
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition SeriesName="Average" ShowItemLabels="False">
                                <telerik:LineSeriesDefinition.Appearance>
                                    <telerik:SeriesAppearanceSettings Stroke="Blue" StrokeThickness="2"/>
                                </telerik:LineSeriesDefinition.Appearance>
                            </telerik:LineSeriesDefinition>
                        </telerik:SeriesMapping.SeriesDefinition>
     
                        <telerik:SeriesMapping.ItemMappings>
                            <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory"/>
                            <telerik:ItemMapping FieldName="AverageValue" DataPointMember="YValue"/>
                        </telerik:SeriesMapping.ItemMappings>
                    </telerik:SeriesMapping>
     
                    <telerik:SeriesMapping ItemsSource="{Binding Values}" LegendLabel="Maximum">
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition SeriesName="Maximum" ShowItemLabels="False">
                                <telerik:LineSeriesDefinition.Appearance>
                                    <telerik:SeriesAppearanceSettings Stroke="Red" StrokeThickness="1"/>
                                </telerik:LineSeriesDefinition.Appearance>
                            </telerik:LineSeriesDefinition>
                        </telerik:SeriesMapping.SeriesDefinition>
     
                        <telerik:SeriesMapping.ItemMappings>
                            <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory"/>
                            <telerik:ItemMapping FieldName="MaximumValue" DataPointMember="YValue"/>
                        </telerik:SeriesMapping.ItemMappings>
                    </telerik:SeriesMapping>
     
                    <telerik:SeriesMapping ItemsSource="{Binding Values}" LegendLabel="Minimum">
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition SeriesName="Minimum" ShowItemLabels="False">
                                <telerik:LineSeriesDefinition.Appearance>
                                    <telerik:SeriesAppearanceSettings Stroke="Green" StrokeThickness="1"/>
                                </telerik:LineSeriesDefinition.Appearance>
                            </telerik:LineSeriesDefinition>
                        </telerik:SeriesMapping.SeriesDefinition>
     
                        <telerik:SeriesMapping.ItemMappings>
                            <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory"/>
                            <telerik:ItemMapping FieldName="MinimumValue" DataPointMember="YValue"/>
                        </telerik:SeriesMapping.ItemMappings>
                    </telerik:SeriesMapping>
                </telerik:RadChart.SeriesMappings>
            </telerik:RadChart>
     
            <telerik:RadChart x:Name="With" Grid.Column="0" Grid.Row="1">
                <telerik:RadChart.SeriesMappings>
                    <telerik:SeriesMapping ItemsSource="{Binding Values}" LegendLabel="Average">
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition SeriesName="Average" ShowItemLabels="False">
                                <telerik:LineSeriesDefinition.Appearance>
                                    <telerik:SeriesAppearanceSettings Stroke="Blue" StrokeThickness="2"/>
                                </telerik:LineSeriesDefinition.Appearance>
                            </telerik:LineSeriesDefinition>
                        </telerik:SeriesMapping.SeriesDefinition>
     
                        <telerik:SeriesMapping.ItemMappings>
                            <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory"/>
                            <telerik:ItemMapping FieldName="AverageValue" DataPointMember="YValue"/>
                        </telerik:SeriesMapping.ItemMappings>
                    </telerik:SeriesMapping>
     
                    <telerik:SeriesMapping ItemsSource="{Binding Values}" LegendLabel="Maximum">
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition SeriesName="Maximum" ShowItemLabels="False">
                                <telerik:LineSeriesDefinition.Appearance>
                                    <telerik:SeriesAppearanceSettings Stroke="Red" StrokeThickness="1"/>
                                </telerik:LineSeriesDefinition.Appearance>
                            </telerik:LineSeriesDefinition>
                        </telerik:SeriesMapping.SeriesDefinition>
     
                        <telerik:SeriesMapping.ItemMappings>
                            <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory"/>
                            <telerik:ItemMapping FieldName="MaximumValue" DataPointMember="YValue"/>
                        </telerik:SeriesMapping.ItemMappings>
                    </telerik:SeriesMapping>
     
                    <telerik:SeriesMapping ItemsSource="{Binding Values}" LegendLabel="Minimum">
                        <telerik:SeriesMapping.SeriesDefinition>
                            <telerik:LineSeriesDefinition SeriesName="Minimum" ShowItemLabels="False">
                                <telerik:LineSeriesDefinition.Appearance>
                                    <telerik:SeriesAppearanceSettings Stroke="Green" StrokeThickness="1"/>
                                </telerik:LineSeriesDefinition.Appearance>
                            </telerik:LineSeriesDefinition>
                        </telerik:SeriesMapping.SeriesDefinition>
     
                        <telerik:SeriesMapping.ItemMappings>
                            <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory"/>
                            <telerik:ItemMapping FieldName="MinimumValue" DataPointMember="YValue"/>
                        </telerik:SeriesMapping.ItemMappings>
                    </telerik:SeriesMapping>
                </telerik:RadChart.SeriesMappings>
     
                <telerik:RadChart.DefaultView>
                    <telerik:ChartDefaultView>
                        <telerik:ChartDefaultView.ChartArea>
                            <telerik:ChartArea>
                                <telerik:ChartArea.AxisX>
                                    <telerik:AxisX  DefaultLabelFormat="MMM-dd" LabelRotationAngle="45" IsDateTime="True"  MajorGridLinesVisibility="Visible" MinorGridLinesVisibility="Visible">
                                    </telerik:AxisX>
                                </telerik:ChartArea.AxisX>
     
                                <telerik:ChartArea.AxisY>
                                    <telerik:AxisY AutoRange="False" MinValue="-1" MaxValue="15"/>
                                </telerik:ChartArea.AxisY>
     
                                <telerik:ChartArea.Annotations>
                                    <telerik:MarkedZone StartY="0" EndY="7" Background="#44CCFF99" />
                                </telerik:ChartArea.Annotations>
     
                                <telerik:ChartArea.Legend>
                                    <telerik:ChartLegend UseAutoGeneratedItems="True" />
                                </telerik:ChartArea.Legend>
                            </telerik:ChartArea>
                        </telerik:ChartDefaultView.ChartArea>
                    </telerik:ChartDefaultView>
                </telerik:RadChart.DefaultView>
            </telerik:RadChart>
        </Grid>
    </UserControl>

    The code:
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;
     
    namespace RadChartTest
    {
        public partial class MainPage : UserControl
        {
            public MainPage()
            {
                Loaded += new RoutedEventHandler(MainPage_Loaded);
     
                InitializeComponent();
            }
     
            void MainPage_Loaded(object sender, RoutedEventArgs e)
            {
                Without.ItemsSource = GetSampleData("Without", 32)[0].Values;
     
                With.ItemsSource = GetSampleData("With", 32)[0].Values;
            }
     
            private List<Statistic> GetSampleData(string GroupName, int Periods)
            {
                Random values = new Random();
     
                Statistic sample = new Statistic(GroupName);
     
                if (Periods < 0)
                {
                    Periods = -Periods;
                }
     
                for (int index = -Periods; index < 0; index += 1)
                {
                    DateTime date = DateTime.Today.AddDays(index * 7.0);
     
                    double average = values.NextDouble() * 10.0;
                    double minimum = values.NextDouble();
                    double maximum = average + (minimum * 2.0);
     
                    sample.Values.Add(new DataPoint(date, average, minimum, maximum));
                }
     
                List<Statistic> samples = new List<Statistic>();
     
                samples.Add(sample);
     
                return (samples);
            }
        }
    }

    And the Statistics class code:
    using System;
    using System.Collections;
    using System.Collections.Generic;
    using System.Collections.ObjectModel;
    using System.Net;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Documents;
    using System.Windows.Ink;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Animation;
    using System.Windows.Shapes;
     
     
    namespace RadChartTest
    {
        public class Statistic
        {
            public Statistic()
            {
                this.Values = new List<DataPoint>();
            }
            public Statistic(string GroupName)
            {
                this.GroupName = GroupName;
     
                this.Values = new List<DataPoint>();
            }
            public Statistic(string GroupName, decimal? GroupRank)
            {
                this.GroupName = GroupName;
                this.GroupRank = GroupRank;
     
                this.Values = new List<DataPoint>();
            }
     
            public string GroupName
            {
                get;
                set;
            }
     
            public decimal? GroupRank
            {
                get;
                set;
            }
     
            public List<DataPoint> Values
            {
                get;
                private set;
            }
        }
     
        public class DataPoint
        {
            public DataPoint()
            {
            }
            public DataPoint(DateTime? Date, double? AverageValue, double? MinimumValue, double? MaximumValue)
            {
                this.Date = Date;
     
                this.AverageValue = AverageValue;
                this.MinimumValue = MinimumValue;
                this.MaximumValue = MaximumValue;
            }
            public DataPoint(DateTime? Date, double? AverageValue, double? MinimumValue, double? MaximumValue, int? CountOf, int? CountOfSmall, int? CountOfLarge)
            {
                this.Date = Date;
     
                this.AverageValue = AverageValue;
                this.MinimumValue = MinimumValue;
                this.MaximumValue = MaximumValue;
     
                this.CountOf = CountOf;
                this.CountOfSmall = CountOfSmall;
                this.CountOfLarge = CountOfLarge;
            }
            public DataPoint(DateTime? Date, decimal? AverageValue, decimal? MinimumValue, decimal? MaximumValue)
            {
                this.Date = Date;
     
                this.AverageValue = Convert.ToDouble(AverageValue);
                this.MinimumValue = Convert.ToDouble(MinimumValue);
                this.MaximumValue = Convert.ToDouble(MaximumValue);
            }
            public DataPoint(DateTime? Date, decimal? AverageValue, decimal? MinimumValue, decimal? MaximumValue, int? CountOf, int? CountOfSmall, int? CountOfLarge)
            {
                this.Date = Date;
     
                this.AverageValue = Convert.ToDouble(AverageValue);
                this.MinimumValue = Convert.ToDouble(MinimumValue);
                this.MaximumValue = Convert.ToDouble(MaximumValue);
     
                this.CountOf = CountOf;
                this.CountOfSmall = CountOfSmall;
                this.CountOfLarge = CountOfLarge;
            }
     
            public DateTime? Date
            {
                get;
                set;
            }
     
            public string AverageLabel
            {
                get { return ("Average"); }
            }
     
            public double? AverageValue
            {
                get;
                set;
            }
     
            public string MinimumLabel
            {
                get { return ("Minimum"); }
            }
     
            public double? MinimumValue
            {
                get;
                set;
            }
     
            public string MaximumLabel
            {
                get { return ("Maximum"); }
            }
     
            public double? MaximumValue
            {
                get;
                set;
            }
     
            public string CountOfLabel
            {
                get { return ("Total Count"); }
            }
     
            public int? CountOf
            {
                get;
                set;
            }
     
            public string CountOfSmallLabel
            {
                get { return ("<= 0.5 Hours"); }
            }
     
            public int? CountOfSmall
            {
                get;
                set;
            }
     
            public string CountOfLargeLabel
            {
                get { return ("> 0.5 Hours"); }
            }
     
            public int? CountOfLarge
            {
                get;
                set;
            }
        }
    }

  2. Answer
    Missing user
    Missing user avatar

    Posted 26 Aug 2011 Link to this post

    Hello John Thompson,

    By default, the RadChart.DefaultView.ChartLegend is associated with the RadChart.DefaultView.ChartArea. When you predefine the DefaultView of the RadChart, the LegendName property of the ChartArea needs to be set to the name of the newly created ChartLegend. Otherwise, your legend items will not be auto generated. For example:
    <telerik:RadChart x:Name="radChart">
        <telerik:RadChart.SeriesMappings>
            ...
        </telerik:RadChart.SeriesMappings>
        <telerik:RadChart.DefaultView>
            <telerik:ChartDefaultView>
                <telerik:ChartDefaultView.ChartLegend>
                    <telerik:ChartLegend x:Name="ChartLegend1"/>
                </telerik:ChartDefaultView.ChartLegend>
                <telerik:ChartDefaultView.ChartArea>
                    <telerik:ChartArea LegendName="ChartLegend1">
                        ...
                    </telerik:ChartArea>
                </telerik:ChartDefaultView.ChartArea>
            </telerik:ChartDefaultView>
        </telerik:RadChart.DefaultView>
    </telerik:RadChart>

    Here you can find more information about RadChart Legend:
    http://www.telerik.com/help/silverlight/radchart-features-chart-legend.html

    I hope this information helps.

    Regards,
    Polina
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

  3. DevCraft banner
Back to Top