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

chartlegend scrollbar

6 Answers 56 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Rakhi
Top achievements
Rank 1
Rakhi asked on 26 Oct 2010, 10:30 AM
How can be scrollbar both horizontal and vertical in chart legend.

6 Answers, 1 is accepted

Sort by
0
Evgenia
Telerik team
answered on 28 Oct 2010, 09:50 AM
Hello Rakhi,

Take a look at this blog post as it describes how to add a ScrollViewer control to the Chart Legend - http://blogs.telerik.com/velinangelov/posts/09-12-23/silverlight_wpf_custom_legend_with_radchart.aspx.

Kind regards,
Evgenia
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
MahMah
Top achievements
Rank 1
answered on 29 Dec 2011, 11:39 AM
Hi Evgenia,
I am curious to know if you have a plan to allow the users to use a command like this :

RadGrid1.DefaultView.Legend.EnableVerticalScroll = True;

I read the provided page but Is there a way like the mentioned command in the future ?
0
Evgenia
Telerik team
answered on 30 Dec 2011, 04:58 PM
Hi,

We thank you for your feedback which was sent to our developers. However we don't have plans to implement such property in near future.

Kind regards,
Evgenia
the Telerik team

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

0
MahMah
Top achievements
Rank 1
answered on 31 Dec 2011, 06:32 AM
Thank you Evgenia for your kind attention.

Regars.

0
MahMah
Top achievements
Rank 1
answered on 02 Jan 2012, 06:13 AM
Here is one remedy that I have found :
I added a chart to a window in MS Blend and extracted its default template and embraced legend section with a ScrollView, Here is final result :
<Style x:Key="RadChartStyle1" TargetType="{x:Type telerik:RadChart}">
       <Setter Property="Template">
           <Setter.Value>
               <ControlTemplate TargetType="{x:Type telerik:RadChart}">
                   <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                       <telerik:ScalePanel MinFullHeight="{TemplateBinding MinFullHeight}" MinFullWidth="{TemplateBinding MinFullWidth}">
                           <Grid Background="{TemplateBinding Background}" Margin="{TemplateBinding Padding}">
                               <Grid x:Name="PART_DefaultLayoutGrid">
                                   <Grid.RowDefinitions>
                                       <RowDefinition Height="Auto"/>
                                       <RowDefinition Height="*"/>
                                   </Grid.RowDefinitions>
                                   <ContentPresenter x:Name="PART_DefaultChartTitleContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}"/>
                                   <telerik:RadDockPanel LastChildFill="True" Grid.Row="1">
                                       <ScrollViewer>
                                           <ContentPresenter x:Name="PART_DefaultChartLegendContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" telerik:RadDockPanel.Dock="{Binding DefaultView.ChartLegendPosition, RelativeSource={RelativeSource TemplatedParent}}"/>
                                       </ScrollViewer>
 
                                       <GridSplitter ResizeDirection="Columns" Width="3" ResizeBehavior="PreviousAndNext"/>
 
                                       <ContentPresenter x:Name="PART_DefaultChartAreaContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}"/>
                                   </telerik:RadDockPanel>
                               </Grid>
                               <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}"/>
                           </Grid>
                       </telerik:ScalePanel>
                   </Border>
               </ControlTemplate>
           </Setter.Value>
       </Setter>
       <Setter Property="Background">
           <Setter.Value>
               <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                   <GradientStop Color="#FFF8F8F8" Offset="1"/>
                   <GradientStop Color="White"/>
               </LinearGradientBrush>
           </Setter.Value>
       </Setter>
       <Setter Property="BorderBrush" Value="#FF848484"/>
       <Setter Property="BorderThickness" Value="1"/>
   </Style>

And used it in this way :

<telerik:RadChart Style="{DynamicResource RadChartStyle1}" Name="chart" Grid.Row="1" BorderBrush="#6d8caf" BorderThickness="1"   Loaded="chart_Loaded" DataBound="chart_DataBound">
        </telerik:RadChart>

Another way is inspired by your blog code sample. We define the defaultview structure then force the chart to render its legend to another place, which is a popup block in another place in window :

<telerik:RadChart Name="chart" Grid.Row="1" BorderBrush="#6d8caf" BorderThickness="1"   Loaded="chart_Loaded" DataBound="chart_DataBound">
            <telerik:RadChart.DefaultView>
                <telerik:ChartDefaultView>
                    <telerik:ChartDefaultView.ChartLegend>
                        <telerik:ChartLegend Visibility="Collapsed"/>
                    </telerik:ChartDefaultView.ChartLegend>
 
                    <telerik:ChartDefaultView.ChartArea>
                        <telerik:ChartArea LegendName="TooltipLegend" />
                    </telerik:ChartDefaultView.ChartArea>
 
                    <telerik:ChartDefaultView.ChartTitle>
                        <telerik:ChartTitle></telerik:ChartTitle>
                    </telerik:ChartDefaultView.ChartTitle>
 
                </telerik:ChartDefaultView>
            </telerik:RadChart.DefaultView>
 
        </telerik:RadChart>

And we can embed legend popuper in anywhere that we wish :
<ToggleButton HorizontalAlignment="Center" VerticalAlignment="Top"
                        x:Name="PopButton" Content="Legend" ClickMode="Release" />
 
<Popup Placement="Bottom" PlacementTarget="{Binding ElementName=PopButton}" StaysOpen="False"
                       IsOpen="{Binding ElementName=PopButton, Path=IsChecked, Mode=TwoWay}">
    <ScrollViewer>
        <telerik:ChartLegend x:Name="TooltipLegend"  Width="180" Background="AliceBlue" />
    </ScrollViewer>
</Popup>

Good luck every one.
0
MahMah
Top achievements
Rank 1
answered on 12 Mar 2012, 07:23 AM
You can also add an expander to your legend presenter to let the user have more space whenever they want:
                        
<telerik:RadExpander ExpandDirection="Right" IsExpanded="True" Header="Chart Legend">
    <ScrollViewer Opacity="50">
        <ContentPresenter x:Name="PART_DefaultChartLegendContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" telerik:RadDockPanel.Dock="{Binding DefaultView.ChartLegendPosition, RelativeSource={RelativeSource TemplatedParent}}"/>
    </ScrollViewer>
</telerik:RadExpander>

It was welcomed by my customer so I hope you have the same experience.

Good Luck.
Tags
Chart
Asked by
Rakhi
Top achievements
Rank 1
Answers by
Evgenia
Telerik team
MahMah
Top achievements
Rank 1
Share this question
or