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

retemplate radchart title area

3 Answers 67 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
william a
Top achievements
Rank 1
william a asked on 21 Aug 2009, 04:05 PM
Is it possible to redefine the control template for the title area in RadChart for SL3?  Not just changing it's font, but moving it's location and freeing up the area?

For my combination line and area series graph, at 230pxX100px, the title is taking up half of the area of the graph. I would like to move the title up and over (ala Canvas. Left and Canvas.Top) and make the graph area use the left over space.

Thank you,

William

3 Answers, 1 is accepted

Sort by
0
Dwight
Telerik team
answered on 26 Aug 2009, 11:15 AM
Hi William,

You will need to re-template the chart. You can find information on how to achieve that in our help, which is available online at http://www.telerik.com/help/silverlight/chart-customize-chart-layout.html

Best,
Evtim
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
william a
Top achievements
Rank 1
answered on 27 Aug 2009, 12:58 PM
Thanks for the link.
I had been to that area of the online docs, but it only shows how to manipulate the legend and chart areas that are already defined.  I have refdefined the layout of my chart pieces, but the default legend and title areas are too big and render out side the control area. 

I'ts the default layouts themselves I want to change, the chartarea, legend area and title areas.  Meaning, the legend area is defined somewhere (DataTemplate) as a textbox with thick ovals stacked underneath it.  I would like to redefine the legend area as a thin, horizontal area with smaller ovals (or even dots) to denote the series names leading out to the right.
So, to visualize the desired layout of this chart. There would be 2 rows in a grid, with 2 columns.  The first row and column, would hold the title, be about 20 pixels high and hold the the textblock for a title.  The second column of that row, would hold the legend - a textblock, and then those series identifier ovals held in a stackpanel horizontally aligned.  The second row, spanning 2 columns would hold the chart area and take the remainder of the available area, star sized.
I think the answer is also within the the header template, but I am not sure how to manipulate/redefine the header template of the legend - or if this is possible.

0
Dwight
Telerik team
answered on 02 Sep 2009, 06:03 AM
Hi william,

If you only need to hide the title, you can just set the width and height of the Title to 0. That way it will not take space. The ChartLegend you need to re-style. Here is the default style:
<Style TargetType="telerikCharting:ChartLegend"
  <Setter Property="Foreground" Value="{StaticResource LegendForeground}" /> 
  <Setter Property="Template" > 
    <Setter.Value> 
      <ControlTemplate TargetType="telerikCharting:ChartLegend"
        <Border Margin="{TemplateBinding Padding}" Background="{TemplateBinding Background}"
          <Grid Margin="10,10,30,0"
            <Grid.RowDefinitions> 
              <RowDefinition Height="Auto" /> 
              <RowDefinition Height="*" /> 
            </Grid.RowDefinitions> 
            <ContentControl Foreground="{TemplateBinding Foreground}" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" /> 
            <ItemsPresenter Grid.Row="1" Height="{TemplateBinding ActualHeight}" /> 
          </Grid> 
        </Border> 
      </ControlTemplate> 
    </Setter.Value> 
  </Setter> 
  <Setter Property="ItemsPanel" > 
    <Setter.Value> 
      <ItemsPanelTemplate> 
        <StackPanel /> 
      </ItemsPanelTemplate> 
    </Setter.Value> 
   </Setter> 
   <Setter Property="HeaderTemplate" > 
     <Setter.Value> 
       <DataTemplate> 
         <Grid> 
           <TextBlock FontSize="12" FontWeight="Bold" Padding="0,0,0,2" HorizontalAlignment="Left" Width="Auto" Height="Auto" Text="{Binding}" /> 
         </Grid> 
       </DataTemplate> 
     </Setter.Value> 
   </Setter> 
   <Setter Property="Margin" Value="10,0,0,0"/> 
</Style> 

Best regards,
Evtim
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Tags
General Discussions
Asked by
william a
Top achievements
Rank 1
Answers by
Dwight
Telerik team
william a
Top achievements
Rank 1
Share this question
or