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

can we put scrolling for telerik chart legend

4 Answers 129 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Priyanka
Top achievements
Rank 1
Priyanka asked on 25 Jun 2010, 10:52 AM
Hello,

Can we put scrolling for chart legend, When there are many items in legend, legend section width gets increased. Is there any solution? and can we set label connectors width

thanks in advance 

4 Answers, 1 is accepted

Sort by
0
Priyanka
Top achievements
Rank 1
answered on 28 Jun 2010, 02:13 PM
Hiee,

I have seen  solution for this problem in another post but that solution is with dataseries and by setting 'UseDefaultLayout=false' , I want to give scrolling to chart legend of pie chart where i am using item mapping(that is seriesmapping). So is there any solution for pie chart with seriesmapping.
 
Please help its urgent...

Thanks in advance
0
Giuseppe
Telerik team
answered on 30 Jun 2010, 01:27 PM
Hello Priyanka,

You can achieve the desired functionality for a databound chart with default layout by customizing the ChartLegend template to contain a ScrollViewer like this:

XAML
<UserControl.Resources>
    <SolidColorBrush x:Key="LegendForeground" Color="#FF000000" />
    <LinearGradientBrush x:Key="LegendBackground" EndPoint="1.96,0.5" StartPoint="-0.96,0.5">
        <GradientStop Color="#FFB5B5B5"/>
        <GradientStop Color="#FFF0F0F0" Offset="0.5"/>
    </LinearGradientBrush>
    <SolidColorBrush x:Key="LegendBorderBrush" Color="#FF848484" />
 
    <Style x:Key="CustomLegendStyle" TargetType="telerik:ChartLegend">
        <Setter Property="Foreground" Value="{StaticResource LegendForeground}" />
        <Setter Property="Background" Value="{StaticResource LegendBackground}" />
        <Setter Property="Padding" Value="10,10,10,5" />
        <Setter Property="Margin" Value="0,0,0,0"/>
        <Setter Property="BorderBrush" Value="{StaticResource LegendBorderBrush}" />
        <Setter Property="BorderThickness" Value="1,1,1,1" />
        <Setter Property="TitleFontWeight" Value="Bold" />
        <Setter Property="Template" >
            <Setter.Value>
                <ControlTemplate TargetType="telerik:ChartLegend">
                    <Border
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}" >
                        <Grid Margin="{TemplateBinding Padding}">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <ContentControl Foreground="{TemplateBinding Foreground}"
                                            FontWeight="{TemplateBinding TitleFontWeight}"
                                            Content="{TemplateBinding Header}"
                                            ContentTemplate="{TemplateBinding HeaderTemplate}"/>
                            <ScrollViewer  Grid.Row="1" HorizontalScrollBarVisibility="Hidden"  VerticalScrollBarVisibility="Auto">
                                <ItemsPresenter />
                            </ScrollViewer>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="ItemsPanel" >
            <Setter.Value>
                <ItemsPanelTemplate>
                    <StackPanel  Orientation="Vertical" />
                </ItemsPanelTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>
 
<Grid x:Name="LayoutRoot" Background="White">
    <telerik:RadChart x:Name="RadChart1" />
</Grid>

C#
public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();
 
        List<ChartData> data = new List<ChartData>();
        data.Add(new ChartData() { YValue = 20 });
        data.Add(new ChartData() { YValue = 70 });
        data.Add(new ChartData() { YValue = 30 });
        data.Add(new ChartData() { YValue = 40 });
        data.Add(new ChartData() { YValue = 45 });
        data.Add(new ChartData() { YValue = 20 });
        data.Add(new ChartData() { YValue = 70 });
        data.Add(new ChartData() { YValue = 30 });
        data.Add(new ChartData() { YValue = 40 });
        data.Add(new ChartData() { YValue = 45 });
        data.Add(new ChartData() { YValue = 20 });
        data.Add(new ChartData() { YValue = 70 });
        data.Add(new ChartData() { YValue = 30 });
        data.Add(new ChartData() { YValue = 40 });
        data.Add(new ChartData() { YValue = 45 });
        data.Add(new ChartData() { YValue = 20 });
        data.Add(new ChartData() { YValue = 70 });
        data.Add(new ChartData() { YValue = 30 });
        data.Add(new ChartData() { YValue = 40 });
        data.Add(new ChartData() { YValue = 45 });
 
        RadChart1.DefaultView.ChartLegend.Style = this.Resources["CustomLegendStyle"] as Style;
        RadChart1.DefaultSeriesDefinition = new PieSeriesDefinition();
        RadChart1.ItemsSource = data;
    }
}
 
public class ChartData
{
    public double YValue
    {
        get;
        set;
    }
}

Hope this helps.


Sincerely yours,
Freddie
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
0
muthukumar
Top achievements
Rank 1
answered on 27 Jun 2016, 12:55 PM

Hi,

I am using RadHtmlChart.  

Can we put scrolling for chart legend, When there are many items in legend, legend section width gets increased. Is there any solution? 

Urgently required.

Thanks in advance.

 

 

0
Martin Ivanov
Telerik team
answered on 29 Jun 2016, 07:26 AM
Hello Muthukumar,

Please note that this is the UI for Silverlight forum. Your question seems related to the ASP.NET chart control. This is why I would ask you to post your question in the corresponding forum.

Regards,
Martin
Telerik
Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Tags
Chart
Asked by
Priyanka
Top achievements
Rank 1
Answers by
Priyanka
Top achievements
Rank 1
Giuseppe
Telerik team
muthukumar
Top achievements
Rank 1
Martin Ivanov
Telerik team
Share this question
or