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

Title in front of PlotArea

5 Answers 92 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Dominik
Top achievements
Rank 1
Dominik asked on 25 May 2011, 10:30 AM
Hi,

I'am trying to position the Chart Titles into the ChartPlotArea.
That's all well and good, but if i'm setting the Background Color of the PlotArea differently than the Background of the ChartArea the PlotArea hides the ChartTitle.
Setting a ZIndex for the PlotArea and the Title dosn't work.
Picture without setting a special background color
Picture with setting a special background color

Here is my Code:
<UserControl.Resources>
    <Style x:Key="XTitleStyle" TargetType="{x:Type telerik:AxisTitle}">
        <Setter Property="Margin" Value="0,-32,1,0"/>
        <Setter Property="HorizontalAlignment" Value="Right"/>
        <Setter Property="Panel.ZIndex" Value="10"/>
    </Style>
 
    <Style x:Key="Y1TitleStyle" TargetType="{x:Type telerik:AxisTitle}">
        <Setter Property="VerticalAlignment" Value="Top"/>
        <Setter Property="RenderTransform">
            <Setter.Value>
                <TransformGroup>
                    <TranslateTransform X="-5" Y="-80"/>
                    <RotateTransform Angle="90"/>
                </TransformGroup>
            </Setter.Value>
        </Setter>
    </Style>
     
    <Style TargetType="{x:Type telerik:MarkedZone}">
        <Setter Property="Panel.ZIndex" Value="-1"/>
    </Style>
 
</UserControl.Resources>
 
<Grid Width="Auto" Height="Auto">
    <telerik:RadChart HorizontalAlignment="Stretch" Margin="10,5,10,5" Name="radChart1" VerticalAlignment="Stretch" BorderThickness="0" Background="{DynamicResource backgroundTabControl}">
 
        <telerik:RadChart.SeriesMappings>
 
            <telerik:SeriesMapping ItemsSource="{Binding Series1, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}" >
                <telerik:SeriesMapping.SeriesDefinition>
                    <telerik:LineSeriesDefinition ShowItemLabels="False" ShowPointMarks="False">
                        <telerik:LineSeriesDefinition.Appearance>
                            <telerik:SeriesAppearanceSettings StrokeThickness="1.5"/>
                        </telerik:LineSeriesDefinition.Appearance>
                    </telerik:LineSeriesDefinition>
                </telerik:SeriesMapping.SeriesDefinition>
                <telerik:SeriesMapping.ItemMappings>
                    <telerik:ItemMapping FieldName="Y" DataPointMember="YValue"/>
                </telerik:SeriesMapping.ItemMappings>
            </telerik:SeriesMapping>
        </telerik:RadChart.SeriesMappings>
 
        <telerik:RadChart.DefaultView>
            <telerik:ChartDefaultView ChartLegend="{x:Null}">
                <telerik:ChartDefaultView.ChartArea>
                     
                    <telerik:ChartArea EnableAnimations="False" EnableStripLinesAnimation="False" SnapsToDevicePixels="True">
                    <!-- Here I'm setting the Background with PlotAreaStyle-->
                        <telerik:ChartArea.PlotAreaStyle>
                            <Style TargetType="{x:Type telerik:ClipPanel}">
                                <Setter Property="Background" Value="White"/>
                                <Setter Property="Panel.ZIndex" Value="-1"/>
                            </Style>
                        </telerik:ChartArea.PlotAreaStyle>
                         
                        <!-- Here I'm setting the Background with a MarkedZone-->
                        <telerik:ChartArea.Annotations>
                            <telerik:MarkedZone Background="White"  />
                        </telerik:ChartArea.Annotations>
                         
                        <telerik:ChartArea.AxisX>
                            <telerik:AxisX AutoRange="False" MajorGridLinesVisibility="Visible" MajorTicksVisibility="Visible" Title="test">
                                <telerik:AxisX.AxisStyles>
                                    <telerik:AxisStyles TitleStyle="{StaticResource XTitleStyle}" />
                                </telerik:AxisX.AxisStyles>
                            </telerik:AxisX>
                        </telerik:ChartArea.AxisX>
                        <telerik:ChartArea.AxisY>
                            <telerik:AxisY AutoRange="False" MajorGridLinesVisibility="Visible" MinorGridLinesVisibility="Collapsed" Title="test" PlotAreaAxisVisibility="Visible" StripLinesVisibility="Collapsed">
                                <telerik:AxisY.AxisStyles>
                                    <telerik:AxisStyles TitleStyle="{StaticResource Y1TitleStyle}"/>
                                </telerik:AxisY.AxisStyles>
                            </telerik:AxisY>
                        </telerik:ChartArea.AxisY>
                    </telerik:ChartArea>
                </telerik:ChartDefaultView.ChartArea>
            </telerik:ChartDefaultView>
        </telerik:RadChart.DefaultView>
    </telerik:RadChart>
</Grid>

I would like to display the AxisTitle above the PlotArea and above any MarkedZones. Is there any solution?

Best regards
Dominik

5 Answers, 1 is accepted

Sort by
0
Evgenia
Telerik team
answered on 28 May 2011, 02:20 PM
Hi Dominik,

I reviewed your code snippet but I can't figure out why do you need to set the Background of the Chart via MarkedZone. Why don't you set the Background like this:

radChart1.DefaultView.ChartArea.Background = new SolidColorBrush(Colors.Azure);

As another suggestion - you can set the Titles (Labels) directly to the MarkedZone so that they will be visible all the time. This approach is shown in our help topic.

Best wishes,
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
Dominik
Top achievements
Rank 1
answered on 30 May 2011, 09:00 AM
Hi Evgenia,

i just want to set the background of the PlotArea not the background of the ChartArea.
I'am setting the background of the PlotArea like this:
<telerik:ChartArea.PlotAreaStyle>
    <Style TargetType="{x:Type telerik:ClipPanel}">
        <Setter Property="Background" Value="White"/>
    </Style>
</telerik:ChartArea.PlotAreaStyle>

Setting the background works well, but i would position the axis titles into the PlotArea like in the first picture i posted.
Then i setting the background of my PlotArea and this background is in front of the axis titles, but i would set the axis titles in foreground.

Best wishes,
Dominik
0
Accepted
Evgenia
Telerik team
answered on 02 Jun 2011, 09:30 AM
Hello Dominik,

To be able to have the AxisTitles visible even though you have provided Background for the PlotArea you should set Canvas.ZIndex property for each of them like this:

<Style x:Key="CustomAxisX" TargetType="telerik:AxisX2D">
           <Setter Property="Canvas.ZIndex" Value="10" />
</Style>
<Style x:Key="CustomAxisY" TargetType="telerik:AxisY2D">
       <Setter Property="Canvas.ZIndex" Value="10" />
</Style>

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
Dominik
Top achievements
Rank 1
answered on 06 Jun 2011, 01:02 PM
Thanks, it works, but not on additional axis.

regards
Dominik
0
Evgenia
Telerik team
answered on 09 Jun 2011, 09:25 AM
Hello Dominik,

I'm glad this worked for you. To be able to make this work for the Additional Axes you should set the correct TargetType for their Style. For example:

<Style x:Key="CustomAxisX" TargetType="telerik:AdditionalAxes2DContainer"
           <Setter Property="Canvas.ZIndex" Value="10" />
</Style>

Greetings,
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
Tags
Chart
Asked by
Dominik
Top achievements
Rank 1
Answers by
Evgenia
Telerik team
Dominik
Top achievements
Rank 1
Share this question
or