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

How to change location of Legends & Have scrolling only for chart and not legend

6 Answers 198 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Yusuf
Top achievements
Rank 1
Yusuf asked on 04 Aug 2009, 05:22 AM
Hi,

In the implementation that I have the chart has lots of data points and hence i have implemented a scroll viewer which allows user to scroll horizontally. I wanted to change the location of the default chart legends which is always shown at the rightmost end to appear at the bottom.

This is the default view that we get

ChartTitle
Chart   ChartLegend

I want it like
ChartTitle
Chart
ChartLegend

Also is it possible to just scroll the chart view and keep the title and legend at fixed location, i.e instead of having all three in scroll viewer have only Chart in the scroll viewer? Here is the current code that I have

<ScrollViewer VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" Grid.Row="1" Grid.Column="1">
            <telerikChart:RadChart x:Name="SeriesChart" >
                <telerikChart:RadChart.LegendStyle>
                    <Style TargetType="Chart:ChartLegend">
                        <Setter Property="ItemsPanel" >
                            <Setter.Value>
                                <ItemsPanelTemplate>
                                    <StackPanel Orientation="Horizontal" />
                                </ItemsPanelTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </telerikChart:RadChart.LegendStyle>
            </telerikChart:RadChart>  
        </ScrollViewer>

I don't want to have a new Chart Area added, i want to use the default view because of custom series mapping that i have in the code behind.
I want to achieve a view like this?
ChartTitle
<ScrollViewer>
Chart
<ScrollViewer>
ChartLegend
Thanks & Regards,
Yusuf

6 Answers, 1 is accepted

Sort by
0
Yusuf
Top achievements
Rank 1
answered on 04 Aug 2009, 06:33 AM
Okie, here is what i did
<telerikChart:RadChart x:Name="SeriesChart" UseDefaultLayout="False" Grid.Row="0">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="1*" />
                        <RowDefinition Height="8*" />
                        <RowDefinition Height="1*" />
                    </Grid.RowDefinitions>
                    
                    <Grid.Resources>
                        <ResourceDictionary>
                            <Style x:Key="MyCustomLegendStyle" TargetType="Chart:ChartLegend">
                                <Setter Property="ItemsPanel" >
                                    <Setter.Value>
                                        <ItemsPanelTemplate>
                                            <StackPanel Orientation="Horizontal" />
                                        </ItemsPanelTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </ResourceDictionary>
                    </Grid.Resources>

                    <Chart:ChartLegend x:Name="ChartLegend1" Header="Legend"
                                 Grid.Row="2" Style="{StaticResource MyCustomLegendStyle}" HorizontalAlignment="Left"/>

                <ScrollViewer VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" Grid.Row="1">
                    <Chart:ChartArea x:Name="ChartArea1" LegendName="ChartLegend1"/>
                </ScrollViewer>
                    
                <Chart:ChartTitle Grid.Row="0" x:Name="ChartTitle1"
                                VerticalAlignment="Top" HorizontalAlignment="Left"/>
                </Grid>
            </telerikChart:RadChart>

But the problem now is I am not able to see anything in the Legend or the Title after setting some value from code behind. Whatever series I plot are shown on the chart but no legend and no title. Also the horizontal scroll bar is not visible any more...
0
Yusuf
Top achievements
Rank 1
answered on 05 Aug 2009, 07:59 PM
Any Ideas? If someone can post some sample xaml to help...

Thanks & Regards,
Yusuf Nazami
0
Yusuf
Top achievements
Rank 1
answered on 07 Aug 2009, 06:03 AM
Hi,

Finally I got the legend and the title arranged as I want it but surprisingly still the scroll viewer is not appaearing as the data points grow.

Here is the XAML, can I have a solution to this scrolling problem for the chart?

<Grid x:Name="LayoutRoot" Background="White">

            <telerikChart:RadChart x:Name="SeriesChart" UseDefaultLayout="False" telerikDragDrop:RadDragAndDropManager.AllowDrop="True">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="1.5*" />
                        <RowDefinition Height="7*" />                        
                    </Grid.RowDefinitions>
                    <Grid.Resources>
                        <ResourceDictionary>
                            <Style x:Key="MyCustomLegendStyle" TargetType="Chart:ChartLegend">
                                <Setter Property="ItemsPanel" >
                                    <Setter.Value>
                                        <ItemsPanelTemplate>
                                            <StackPanel Orientation="Horizontal" />
                                        </ItemsPanelTemplate>
                                    </Setter.Value>
                                </Setter>
                            </Style>
                        </ResourceDictionary>
                    </Grid.Resources>

                <ScrollViewer VerticalScrollBarVisibility="Disabled" HorizontalScrollBarVisibility="Auto" Grid.Row="1" >
                    <Chart:ChartArea x:Name="ChartArea1" LegendName="ChartLegend1" Grid.Row="1" />
                </ScrollViewer>
                
                    <StackPanel Orientation="Horizontal"  Grid.Row="0">
                    <Chart:ChartTitle  x:Name="ChartTitle1"
                                VerticalAlignment="Top" HorizontalAlignment="Left" />
                    
                        <Chart:ChartLegend x:Name="ChartLegend1"
                                 Style="{StaticResource MyCustomLegendStyle}" HorizontalAlignment="Left" />
                   
                    </StackPanel>
                </Grid>
            </telerikChart:RadChart>

Thanks & Regards,
Yusuf Nazami
0
Vladimir Milev
Telerik team
answered on 07 Aug 2009, 11:57 AM
Hello Yusuf,

When the points grow they get less wide to fit in the space allotted. The ChartArea will not grow in size and will now cause the ScrollViewer to trigger its scrollbars.

All the best,
Vladimir Milev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
tran ai
Top achievements
Rank 1
answered on 19 Mar 2010, 08:47 AM
Thank you for your solution, but I do the same like you and no data will be shown in the screen. Do you have any idea?
0
Vladimir Milev
Telerik team
answered on 24 Mar 2010, 08:06 AM
Hi guys,

We have some new legend functionality available now. Check it out here.

All the best,
Vladimir Milev
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.
Tags
Chart
Asked by
Yusuf
Top achievements
Rank 1
Answers by
Yusuf
Top achievements
Rank 1
Vladimir Milev
Telerik team
tran ai
Top achievements
Rank 1
Share this question
or