I need axes as described below. I can either modify your existing axis control or add my own in a canvas next to the SciChartSurface. So far I have been unable to modify your existing axis to fit my needs. A Y axis should look like this typical logarithmic axis (range 2 to 2000):
|----------------- Resistivity ------------------|
2 2000
The specifications are
1.) Tick marks only at the end
2.) Title straddles the axis
3.) One axis per curve on the chart
4.) Axis uses same color as curve
5.) Axis uses same dash pattern as curve
6.) The edge of the chart is not an axis
This is basically a combination of a legend with multiple axes. I have not been able to get this effect with existing controls, so I have started to make my own in a canvas. To do this I need to line up my two tick marks with the edges of the chart. How can I obtain the location of the edges?
- Stephen Painchaud asked 9 years ago
- You must login to post comments
Hi there,
Thanks for your inquiry. Actually I have some ideas for you to try, maybe you don’t need to write a custom control. So first of all, you should hide the axis labels and ticks setting DrawLabels and DrawMinor/MajorTicks to False. Then, it’s possible to modify the axis title setting the TitleStyle property, as it is demonstrated in the Xaml Styling example. You could set HorizontalAlignment to Stretch on it, and put 2 Lines and a TextBlock inside, binding/setting StrokeDashArray of the lines. Also setting the Margin to a negative value will allow to shift the title upper(to overlay the axis).
To get two large ticks at the edges, you should configure the BorderThickness property so the side lines appears, like it is done in this example:
<s:NumericAxis BorderThickness="2,0,2,0" BorderBrush="..." ... />
And, finally, to get two labels at the edges, you could set up two TextBlocks and bind them to VisibleRange.Min/Max correspondingly.
Also it is possible to override the TickProvider in the way that it would generate only 2 ticks.
Please let us know if this approach is convenient for you. Feel free to comment if you have any questions,
Best regards,
Yuriy
- Guest answered 9 years ago
- last edited 9 years ago
- You must login to post comments
Thank for the tips. I have almost everything working, except for binding the StrokeDashArray of the line to the StrokeDashArray of the series.
My axis style is:
<Style x:Key="YAxisTitleStyle" TargetType="s:AxisTitle">
<Setter Property="HorizontalAlignment" Value="Stretch"/>
<Setter Property="VerticalAlignment" Value="Center"/>
<Setter Property="Margin" Value="0,0,0,-5"/>
<Setter Property="ContentTemplate">
<Setter.Value>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Line X2="{Binding ActualWidth, RelativeSource={RelativeSource Self}}"
Stroke="{Binding Path=BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type s:LogarithmicNumericAxis}}}"
StrokeThickness="2"
StrokeDashArray=""
HorizontalAlignment="Stretch" VerticalAlignment="Center"></Line>
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" Text="{Binding}" Background="White" Padding="5"
Foreground="{Binding Path=BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type s:NumericAxis}}}"
Grid.Row="0"/>
<TextBlock HorizontalAlignment="Left" VerticalAlignment="Bottom" Background="White" Padding="2,0,0,0"
Text="{Binding Path=VisibleRange.Min, RelativeSource={RelativeSource AncestorType={x:Type s:NumericAxis}}}"
Foreground="{Binding Path=BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type s:NumericAxis}}}"
Grid.Row="1"/>
<TextBlock HorizontalAlignment="Right" VerticalAlignment="Bottom" Background="White" Padding="0,0,2,0"
Text="{Binding Path=VisibleRange.Max, RelativeSource={RelativeSource AncestorType={x:Type s:NumericAxis}}}"
Foreground="{Binding Path=BorderBrush, RelativeSource={RelativeSource AncestorType={x:Type s:NumericAxis}}}"
Grid.Row="1"/>
</Grid>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
The axes are:
<s:SciChartSurface.YAxes>
<s:LogarithmicNumericAxis x:Name="RhAxis" AxisAlignment="Top" VisibleRange="0.2,2000" FlipCoordinates="True"
DrawMajorTicks="False" DrawMinorTicks="False" DrawLabels="False" Id="RhAxis"
AxisTitle="Rh" TitleStyle="{StaticResource YAxisTitleStyle}"
BorderThickness="2,0,2,0"
BorderBrush="{Binding ElementName=HResitivitySeries, Path=SeriesColor, Converter={StaticResource ColorToBrushConverter}}"/>
<s:LogarithmicNumericAxis x:Name="RvAxis" AxisAlignment="Top" VisibleRange="0.2,2000" FlipCoordinates="True"
DrawMajorTicks="False" DrawMinorTicks="False" DrawLabels="False" Id="RvAxis"
AxisTitle="Rv" TitleStyle="{StaticResource YAxisTitleStyle}"
BorderThickness="2,0,2,0"
BorderBrush="{Binding ElementName=VResitivitySeries, Path=SeriesColor, Converter={StaticResource ColorToBrushConverter}}"/>
</s:SciChartSurface.YAxes>
The results look very good. I have attached an image.
- Stephen Painchaud answered 9 years ago
- You must login to post comments
Please login first to submit.