SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, iOS Chart, Android Chart and JavaScript Chart Components
Hey guys,
I’m looking at changing the Numeric Axes on the Right and Left axes of my Chart, to right-align the Text within the Axis Labels.
I noticed this topic where Yuriy hinted that in 2.0 this would be a supported feature, but can’t seem to see what it would be:
http://http://www.scichart.com/questions/question/x-and-y-axis-formatting/
The “work around” featured in that topic doens’t seem to change anything in my situation.
I have tried setting FlowDirection to “RightToLeft”, which does the job, but has some ugly placement side-effects.
Is there something I’ve overlooked?
Thanks,
Miles
UPDATE JUNE 2014
Hi Everyone,
Axis Label styling was introduced in SciChart v3.0. You can now set a Style for a label including margins, LayoutTransforms etc…
Please see our SciChart v3.0 Release Notes.
5. Axis Styling improvements
Usage:
<!-- Styling Tick Labels with rotation and custom font-size and foreground -->
<s:DateTimeAxis>
<s:DateTimeAxis.TickLabelStyle>
<Style TargetType="s:DefaultTickLabel">
<Setter Property="Foreground" Value="Blue" />
<Setter Property="FontSize" Value="25" />
<Setter Property="LayoutTransform">
<Setter.Value>
<RotateTransform Angle="45" />
</Setter.Value>
</Setter>
</Style>
</s:DateTimeAxis.TickLabelStyle>
</s:DateTimeAxis>
<!-- Styling Numeric Axis Tick Labels -->
<s:NumericAxis>
<s:NumericAxis.TickLabelStyle>
<Style TargetType="s:NumericTickLabel">
<Setter Property="Foreground" Value="Blue" />
<Setter Property="FontSize" Value="25" />
</Style>
</s:NumericAxis.TickLabelStyle>
</s:NumericAxis>
</pre>
<!-- Declare an Axis Title Template -->
<Style x:Key="BottomAxisTitleStyle" TargetType="s:AxisTitle">
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<StackPanel>
<TextBlock Margin="0,3,0,0"
Style="{StaticResource TitleTextStyle}"
Text="Showing time on"/>
<TextBlock HorizontalAlignment="Center"
VerticalAlignment="Center"
Text="{Binding}" />
<TextBlock Margin="0,0,0,3"
Style="{StaticResource TitleTextStyle}"
Text="(daily Timeframe)"/>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- Apply an Axis Title Template -->
<s:DateTimeAxis AxisTitle="Time Axis Title" TitleStyle="{StaticResource BottomAxisTitleStyle}" Style="{StaticResource AxisStyle}"/>
Also the XAML Styling application demonstrates this.
Best regards,
Andrew
Hi Miles,
Just an update for you – there is a workaround to style axis ticks. We are using this on our XamlStyling example to change the font-size of axis tick labels. Unfortunately it also changes the font size of the axis title.
<s:NumericAxis AxisAlignment="Right" AxisTitle="Axis Right Title" > <s:NumericAxis.Resources> <!-- Example of styling axis labels--> <Style TargetType="TextBlock"> <Setter Property="Margin" Value="0,0,0,0"/> <Setter Property="FontFamily" Value="Arial"/> <Setter Property="FontWeight" Value="Bold"/> <Setter Property="FontSize" Value="20"/> </Style> </s:NumericAxis.Resources> </s:NumericAxis>
As Yuriy said, we are working on this (and other features!) for SciChart v2.5.
Best regards,
Andrew
<Style TargetType="TextBlock"> <Setter Property="Width" Value="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType=axes:NumericAxis}}"/> <Setter Property="Padding" Value="0 0 10 0" /> <Setter Property="TextAlignment" Value="Right" /> </Style>Cheers, Miles
Please login first to submit.