This is a migrated thread and some comments may be shown as answers.

Legend not showing

8 Answers 187 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
Marcel
Top achievements
Rank 1
Marcel asked on 18 Apr 2013, 04:48 PM
Hello,

I am using 2013 Q1, Silverlight 5. I understand from

http://www.telerik.com/products/silverlight/whats-new/release_notes/q1-2013-version-2013-1-0220.aspx#chartview

 that legends are now supported in ChartView OOTB. I have looked at this demo http://demos.telerik.com/silverlight/#ChartView/Gallery/Bar but still can't get my legend to appear. I have tried both declarative and via code. What am I missing?  I could not find any documentation in the online help.

Thank you.
<telerik:RadTileView Name="MetricsTileView" MinimizedItemsPosition="Right" IsDockingEnabled="True" MaximizeMode="ZeroOrOne" 
                     ColumnsCount="3" RowsCount="3"  MaxHeight="550" MinimizedColumnWidth="200" MinimizedRowHeight="200"
                     SizeChanged="MetricsTileView_SizeChanged">
    <telerik:RadTileViewItem Header="Metric A" >
        <telerik:RadCartesianChart x:Name="MetricAChart" >
            <telerik:RadCartesianChart.HorizontalAxis>
                <telerik:CategoricalAxis></telerik:CategoricalAxis>
            </telerik:RadCartesianChart.HorizontalAxis>
            <telerik:RadCartesianChart.VerticalAxis>
                <telerik:LinearAxis Maximum="100"></telerik:LinearAxis>
            </telerik:RadCartesianChart.VerticalAxis>
            <telerik:RadCartesianChart.Series>
                <telerik:LineSeries Stroke="Orange" StrokeThickness="2" ShowLabels="True">
                    <telerik:LineSeries.DataPoints>
                        <telerik:CategoricalDataPoint Category="Jan" Value="20"/>
                        <telerik:CategoricalDataPoint Category="Feb" Value="40"/>
                        <telerik:CategoricalDataPoint Category="Mar" Value="35"/>
                        <telerik:CategoricalDataPoint Category="Apr" Value="60"/>
                        <telerik:CategoricalDataPoint Category="May" Value="30"/>
                        <telerik:CategoricalDataPoint Category="Jun" Value="70"/>
                    </telerik:LineSeries.DataPoints>
                    <telerik:LineSeries.LegendSettings>
                        <telerik:SeriesLegendSettings Title="2010" />
                    </telerik:LineSeries.LegendSettings>
                </telerik:LineSeries>                           
            </telerik:RadCartesianChart.Series>
        </telerik:RadCartesianChart>
    </telerik:RadTileViewItem>
CalendarSummaryGlobalSeries = new BarSeries();
CalendarSummaryGlobalSeries.ShowLabels = true;
CalendarSummaryGlobalSeries.CombineMode = Telerik.Charting.ChartSeriesCombineMode.Stack;
// this does not work
CalendarSummaryGlobalSeries.LegendSettings = new SeriesLegendSettings();
CalendarSummaryGlobalSeries.LegendSettings.SetValue(SeriesLegendSettings.TitleProperty, "Global");
CalendarSummaryChart.Series.Add(CalendarSummaryGlobalSeries);

8 Answers, 1 is accepted

Sort by
0
Accepted
Petar Kirov
Telerik team
answered on 23 Apr 2013, 12:24 PM
Hi Marcel,

In addition to setting the LegendSettings property of the series that you want to be visible in the legend, you need to declare the actual legend and to bind its items to the chart.LegendItems collection:
<telerik:RadTileViewItem Header="Metric A" >
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
 
        <telerik:RadLegend Grid.Column="0"
               Items="{Binding LegendItems, ElementName=MetricAChart}"/>
 
        <telerik:RadCartesianChart x:Name="MetricAChart" Grid.Column="1">
            <!--...-->
        </telerik:RadCartesianChart>
    </Grid>
</telerik:RadTileViewItem>

For more information, please check this help topic.
 
Regards,
Petar Kirov
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Marcel
Top achievements
Rank 1
answered on 30 Apr 2013, 07:54 PM
Hello Petar,

Thank you for you reply. I undestand now. One further question: is it possible to use legends and charts in a RadTileView?  I have a 3 by 3 configuration (9 charts). I would still like to be able to maximize the tiles but I do not need the docking functionality.

Any advice is appreciated.
0
Marcel
Top achievements
Rank 1
answered on 03 May 2013, 02:34 PM
Yes. RadLegend, RadChartView and RadTileView work well together! Here is the XAML. I need to repeat the code for each of my nine charts. Note: the RadFluidContentControl is not needed.
<telerik:RadTileViewItem  x:Name="DatabaseSummaryTileItem" Header="Database Summary" Position="0">
    <telerik:RadFluidContentControl ContentChangeMode="Manual"
                            State="Normal"
                            TransitionDuration="0:0:.5">
        <!--restored tile view-->
        <telerik:RadFluidContentControl.Content>
            <Border>
                <Grid>
                        <telerik:RadCartesianChart x:Name="DatabaseSummaryChart">
                            <telerik:RadCartesianChart.HorizontalAxis>
                                <telerik:CategoricalAxis></telerik:CategoricalAxis>
                            </telerik:RadCartesianChart.HorizontalAxis>
                            <telerik:RadCartesianChart.VerticalAxis>
                                <telerik:LinearAxis></telerik:LinearAxis>
                            </telerik:RadCartesianChart.VerticalAxis>
                            <telerik:RadCartesianChart.Series>
                                <telerik:LineSeries x:Name="DatabaseSummarySeries" ShowLabels="True">
                                </telerik:LineSeries>
                            </telerik:RadCartesianChart.Series>
                        </telerik:RadCartesianChart>
                </Grid>
            </Border>
        </telerik:RadFluidContentControl.Content>
          
        <!--small tile view-->
        <telerik:RadFluidContentControl.SmallContent>
            <Border>
                <Grid Margin="2 2">
                        <telerik:RadCartesianChart x:Name="DatabaseSummarySmallChart">
                            <telerik:RadCartesianChart.HorizontalAxis>
                                <telerik:CategoricalAxis></telerik:CategoricalAxis>
                            </telerik:RadCartesianChart.HorizontalAxis>
                            <telerik:RadCartesianChart.VerticalAxis>
                                <telerik:LinearAxis></telerik:LinearAxis>
                            </telerik:RadCartesianChart.VerticalAxis>
                            <telerik:RadCartesianChart.Series>
                                <telerik:LineSeries x:Name="DatabaseSummarySmallSeries">
                                </telerik:LineSeries>
                            </telerik:RadCartesianChart.Series>
                        </telerik:RadCartesianChart>
                </Grid>
            </Border>
        </telerik:RadFluidContentControl.SmallContent>
        <!--large tile view-->
        <telerik:RadFluidContentControl.LargeContent>
            <Grid>
                <!-- avoid error 'the property is set more than once -->
            <telerik:RadLegend Grid.Column="1"
                    Items="{Binding LegendItems, ElementName=DatabaseSummaryLargeChart}" 
                   HorizontalAlignment="Right" VerticalAlignment="Top"/>
            <Grid Margin="2 2">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="9*" MinWidth="0" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <StackPanel Grid.Column="0" 
                    Margin="0 0 0 0">
                    <telerik:RadCartesianChart x:Name="DatabaseSummaryLargeChart" MinWidth="620" MinHeight="500">
                        <telerik:RadCartesianChart.HorizontalAxis>
                            <telerik:CategoricalAxis></telerik:CategoricalAxis>
                        </telerik:RadCartesianChart.HorizontalAxis>
                        <telerik:RadCartesianChart.VerticalAxis>
                            <telerik:LinearAxis></telerik:LinearAxis>
                        </telerik:RadCartesianChart.VerticalAxis>
                        <telerik:RadCartesianChart.Series>
                            <telerik:LineSeries x:Name="DatabaseSummaryLargeSeries" ShowLabels="True">
                                <telerik:LineSeries.LegendSettings>
                                    <telerik:SeriesLegendSettings Title="# Databases" />
                                </telerik:LineSeries.LegendSettings>
                            </telerik:LineSeries>
                        </telerik:RadCartesianChart.Series>
                    </telerik:RadCartesianChart>
                </StackPanel>
                <!--<StackPanel Grid.Column="1"
                    Margin="0 0 0 0"
                    Orientation="Horizontal">
                    <TextBlock FontFamily="Segoe UI"
                       FontSize="10"
                       Text="Legend" />
                </StackPanel>-->
            </Grid>
            </Grid>
        </telerik:RadFluidContentControl.LargeContent>
    </telerik:RadFluidContentControl>
</telerik:RadTileViewItem>
// Restored Tile
//
DatabaseSummarySeries = DatabaseSummaryChart.Series[0] as LineSeries;
DatabaseSummarySeries.CategoryBinding = new GenericDataPointBinding<DataPoint,
    string>() { ValueSelector = dataPoint => dataPoint.XValue };
DatabaseSummarySeries.ValueBinding = new GenericDataPointBinding<DataPoint,
    double>() { ValueSelector = dataPoint => dataPoint.YValue };
this.DatabaseSummarySeries.ItemsSource = dataPoints;
// Large Tile
// 
DatabaseSummaryLargeSeries = DatabaseSummaryLargeChart.Series[0] as LineSeries;
DatabaseSummaryLargeSeries.CategoryBinding = new GenericDataPointBinding<DataPoint,
    string>() { ValueSelector = dataPoint => dataPoint.XValueLarge };
DatabaseSummaryLargeSeries.ValueBinding = new GenericDataPointBinding<DataPoint,
    double>() { ValueSelector = dataPoint => dataPoint.YValue };
this.DatabaseSummaryLargeSeries.ItemsSource = dataPoints;
// Small Tile
// 
DatabaseSummarySmallSeries = DatabaseSummarySmallChart.Series[0] as LineSeries;
DatabaseSummarySmallSeries.CategoryBinding = new GenericDataPointBinding<DataPoint,
    string>() { ValueSelector = dataPoint => dataPoint.XValueSmall };
DatabaseSummarySmallSeries.ValueBinding = new GenericDataPointBinding<DataPoint,
    double>() { ValueSelector = dataPoint => dataPoint.YValue };
this.DatabaseSummarySmallSeries.ItemsSource = dataPoints;
0
Petar Marchev
Telerik team
answered on 03 May 2013, 04:06 PM
Hello Marcel,

You asked if "is it possible to use legends and charts in a RadTileView". Yes, you can use the three controls together. I suggest you examine our online examples here and help topics here. If any questions about the TileView arise I will ask that you open a new thread for TileView so that we do not clutter the ChartView threads with unrelated inquiries.

Regards,
Petar Marchev
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

0
Chinmaya
Top achievements
Rank 1
answered on 19 Aug 2014, 09:42 AM
I am new to silverlight and telerik I have similar problem like "legend not showing " . I have done most of the things from code behind as i am not much comfortable with xaml. I have one base chart from which other chart are inherited  and in code sets there properties.

i also trying to show legend for series and my code is like this
                    PointSeries valueSeries= new PointSeries();                   
                    valueSeries.PointTemplate = App.Current.Resources["PointTemplate" + SeriesCounter] as DataTemplate;       
                    valueSeries.ItemsSource = location.Parameter.Results;
                    valueSeries.CategoryBinding = new PropertyNameDataPointBinding("Time");
                    valueSeries.ValueBinding = new PropertyNameDataPointBinding("Val");                  
                    valueSeries.LegendSettings = new SeriesLegendSettings() { Title = "Value Series" };

but i am not getting the legend

please help me with code snipset to declare the actual legend and to bind its items to the chart.LegendItems collection:
0
Petar Marchev
Telerik team
answered on 20 Aug 2014, 08:12 AM
Hello Chinmaya,

Please explore the links provided earlier in this thread (online examples here and help topics here). You will not see a legend by only setting the LegendSettings property. This property tells the chart to populate the LegendItems property by producing a legend item per series. You then need to include a RadLegend control that is bound the chart:
RadLegend legend = new RadLegend();
legend.Items = chart1.LegendItems;

Regards,
Petar Marchev
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
0
Chinmaya
Top achievements
Rank 1
answered on 02 Sep 2014, 03:08 PM
Hello Marchev,

I tried the above code but still not getting the legend.
 
my corrected code is as below.

  RadLegend legendSettings = new RadLegend();
                    legendSettings.Items = chart.LegendItems;
                    legendSettings.Visibility = Visibility.Visible;

 PointSeries valueSeries = new PointSeries();
                        valueSeries.PointTemplate = App.Current.Resources["PointTemplate" + SeriesCounter] as DataTemplate;                       
                        valueSeries.ItemsSource = location.Parameter.Results;
                        valueSeries.FontSize= 1;
                        valueSeries.CategoryBinding = new PropertyNameDataPointBinding("Time");
                        valueSeries.ValueBinding = new PropertyNameDataPointBinding("Val");
                        valueSeries.Visibility = System.Windows.Visibility.Visible;
                        valueSeries.LegendSettings = new SeriesLegendSettings();

Thank you very much for the support.

 
0
Petar Marchev
Telerik team
answered on 03 Sep 2014, 11:20 AM
Hello Chinmaya,

You can debug (on the click of a button) and see if the LegendItems property of the chart is properly populated. You can than see if the Items property of the RadLegend is properly bound and if the correct count of items is in the collection. Make sure that you have inserted the RadLegend in the visual tree, in a location that you can see. You can use some UI tool (such as free WPF inspector) to see if visual elements are populated in the legend.

If these do not help, please create a small project to reproduce this behavior and send it to us so that we can take a look and see what is missing.

Regards,
Petar Marchev
Telerik
 
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
 
Tags
ChartView
Asked by
Marcel
Top achievements
Rank 1
Answers by
Petar Kirov
Telerik team
Marcel
Top achievements
Rank 1
Petar Marchev
Telerik team
Chinmaya
Top achievements
Rank 1
Share this question
or