Extending RadCartesianChart

[Domagoj]

Hello,

I'm extending your RadCartesianChart to provide Legend support. Creating them manually is not an option for us (all series are dynamic and mapped to signals configured by user), and we don't want to create user control which will contain RadCartesianChart and Legends because we need to access all properties of RadCartesianChart directly on our control because they will be configurable in external tool.

The problem I've encountered is that RadCartesianChart ignores this template and just takes the width and height of the whole control,
and not the size which was given in this template. In the end I always get legend over the graph area as if I were using Grid for layouting.

How can I resolve this?

Control template I've created for my control is this:

  <ControlTemplate TargetType="{x:Type CartesianChart:ConfigurableCartesianChart}">
                        <DockPanel LastChildFill="True">
                            <Grid Width="{TemplateBinding LegendWidth}"
                                  Height="{TemplateBinding LegendHeight}"
                                  DockPanel.Dock="{TemplateBinding LegendPosition}"
                                  Margin="5">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto" />
                                    <RowDefinition />
                                </Grid.RowDefinitions>
                                <TextBlock Margin="2" VerticalAlignment="Center" Text="{TemplateBinding LegendTitle}" />
                                <ItemsControl ItemsSource="{Binding Series}" Grid.Row="1">
                                    <ItemsControl.ItemTemplate>
                                        <DataTemplate>
                                            <Grid DataContext="{Binding Configuration}">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="Auto" />
                                                    <ColumnDefinition />
                                                </Grid.ColumnDefinitions>
                                                <Line Width="12" Height="12" X1="0" Y1="6" X2="12" Y2="6" 
                                                      Stroke="{Binding SeriesStrokeColor}" StrokeThickness="2" 
                                                      VerticalAlignment="Center" MaxWidth="100" Margin="5" />
                                                <TextBlock Grid.Column="1" Text="{Binding DisplayName}"
                                                           VerticalAlignment="Center" />
                                            </Grid>
                                        </DataTemplate>
                                    </ItemsControl.ItemTemplate>
                                </ItemsControl>
                            </Grid>

                            <!--from CartesianChart template-->
                            <Border x:Name="layoutRoot" 
                                    BorderBrush="{TemplateBinding BorderBrush}" 
                                    BorderThickness="{TemplateBinding BorderThickness}" 
                                    Background="{TemplateBinding Background}">
                                <Grid>
                                    <ContentPresenter x:Name="emptyContent" 
                                                      ContentTemplate="{TemplateBinding EmptyContentTemplate}" 
                                                      Content="{TemplateBinding EmptyContent}" 
                                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" 
                                                      IsHitTestVisible="False" 
                                                      Visibility="Collapsed"
                                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                                    <Canvas x:Name="adornerContainer" 
                                            Background="Transparent" 
                                            HorizontalAlignment="Stretch" 
                                            VerticalAlignment="Stretch">
                                        <Canvas x:Name="labelContainer" 
                                                HorizontalAlignment="Stretch"
                                                VerticalAlignment="Stretch">
                                            <Canvas x:Name="renderSurface" 
                                                    HorizontalAlignment="Stretch" 
                                                    VerticalAlignment="Stretch">
                                                <Border x:Name="plotAreaDecoration" Style="{TemplateBinding PlotAreaStyle}"/>
                                            </Canvas>
                                        </Canvas>
                                    </Canvas>
                                </Grid>
                            </Border>
                         </DockPanel>
                    </ControlTemplate>

[Petar Marchev]

Hello Domagoj,

We have not yet created a Legend control to work with the RadChartView, but we have plans to introduce one for the next official release. Most probably it will be a stand alone control which you will be able to place wherever you like, and it will not be a part of the chart's template.

I suggest you follow this approach, too. Create a user control (or a custom control if really needed) that wraps two controls - the chart on left and the legend on the right. You can expose a property Chart (type RadCartesianChart) of this control and manipulate the chart from this property. Retemplating the chartview would not work because the chart internally works with its full size and not the size of the Grid in its template.

Greetings,
Petar Marchev
the Telerik team

[Domagoj]

That's exactly what I did in the end. It's not pretty but it works.
I've seen your plans about legend but I'm running on a tight schedule and legend was a "must have" as part of our configurable control.
Do you have any updates on when the legend will be officially released (approximate date)?

Regards,
Domagoj Rukavina

[Petar Marchev]

Our current plans are to release the Legend control with the next official release (Q1 2013, scheduled for February).

All the best,
Petar Marchev
the Telerik team

[Senthil kumar]

Hi,

Currently, I am currently using WPF telerik RAD control version 2013.2.724.40. could you please give sample/suggestion how to use legend in the latest RADcartesianchart.

is Build-In Legend implementation available in latest version?

[Petar Marchev]

Hi Senthil,

You can find many examples in our QSF that use a legend, so you can see how it is used there.

Regards,
Petar Marchev
Telerik