Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Positioning of Axis Label in a DateTimeAxis

At the moment I have a date time axis where the date is in-line with the points, is there anyway to get this date to appear in the center such as on a bar chart.

Chart Img

<Style x:Key="DateTimeAxisLabelStyle2" TargetType="chartingToolkit:DateTimeAxisLabel">
    <Setter Property="DaysIntervalStringFormat" Value="{}{0:dd-MMM}" />
    <Setter Property="HoursIntervalStringFormat" Value="{}{0:hh:mm tt}" />
    <!--<Setter Property="RenderTransformOrigin" Value="1,0.5" />
    <Setter Property="RenderTransform">
       <Setter.Value>
          <RotateTransform Angle="-45" />
       </Setter.Value>
    </Setter>-->
   <!--<Setter Property="Margin" Value="30,0,-10,0" />-->
</Style>

<chartingToolkit:DateTimeAxis IntervalType="Days"
                               Interval="1"
                               Minimum="{Binding StartDate}"
                               Maximum="{Binding EndDate}"
                               Orientation="X"
                               VerticalContentAlignment="Center"
                               Title="Day"
                               AxisLabelStyle="{StaticResource DateTimeAxisLabelStyle2}" />

Any help would be greatly appreciated.

like image 786
Chris Avatar asked Sep 07 '15 12:09

Chris


1 Answers

Here's what i got:

XAML:

<Window.Resources>
    <Style x:Key="DateTimeAxisLabelStyle1" TargetType="{x:Type chartingToolkit:DateTimeAxisLabel}">
        <Setter Property="DaysIntervalStringFormat" Value="{}{0:dd-MMM}"></Setter>
        <Setter Property="RenderTransformOrigin" Value="0.80,0.20"></Setter>
        <Setter Property="RenderTransform">
            <Setter.Value>
                <RotateTransform Angle="-90"></RotateTransform>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>
<Grid>
    <chartingToolkit:Chart Margin="0" Title="Chart Title">
        <chartingToolkit:Chart.DataContext>
            <local:MyDataCollection/>
        </chartingToolkit:Chart.DataContext>
        <chartingToolkit:Chart.Axes>
            <chartingToolkit:DateTimeAxis Minimum="{Binding StartDate}" Maximum="{Binding EndDate}" Orientation="X" ShowGridLines="True" AxisLabelStyle="{DynamicResource DateTimeAxisLabelStyle1}"/>
        </chartingToolkit:Chart.Axes>
        <chartingToolkit:LineSeries DependentValuePath="Y" IndependentValuePath="X" ItemsSource="{Binding}"/>
    </chartingToolkit:Chart>
</Grid>

Chart:

enter image description here

like image 98
jsanalytics Avatar answered Oct 21 '22 17:10

jsanalytics