2015-09-07 16 views
11

Al momento ho un asse del tempo della data in cui la data è in linea con i punti, c'è comunque per far apparire questa data al centro come su un grafico a barre.Posizionamento dell'etichetta dell'asse in un DateTimeAxis

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}" /> 

Qualsiasi aiuto sarebbe molto apprezzato.

+0

La tua domanda non è abbastanza chiaro, si vuole mostrare in X asse la data tra ogni due punti consecutivi (oltre alle date in ogni punto del grafico)? – Usama

+0

Voglio solo spostare l'etichetta sull'asse x lungo (al centro), questo può essere ottenuto attraverso l'uso dei margini, tuttavia l'asse x è dinamico, quindi l'uso di margini codificati è un no-go. Tutti gli altri dati sul grafico dovrebbero rimanere statici – Chris

+0

Non c'è alcun codice dietro, gli elementi del grafico L'origine viene portata tramite una sp, cosa ti aspetti di vedere? – Chris

risposta

0

Ecco cosa ho fatto utilizzando lo WPF Toolkit Source come riferimento.

Ho creato una classe personalizzata derivata da DateTimeAxis, quindi sovrascrivere il metodo "GetPlotAreaCoordinate". DateTimeAxis.Render() chiama quel metodo tre volte con lo stesso elenco di valori "DateTime", una volta per i MajorTickmarks, una volta per MinorTickmarks e una volta per l'etichetta della data. Non c'erano segni di spunta minori nell'elenco, quindi il metodo veniva effettivamente chiamato solo due volte. Io tengo solo un elenco dei valori che sono stati valutati e presumo che se è nella lista ha già fatto i segni di spunta e ora sta facendo le etichette.

class CustomDateTimeAxis : DateTimeAxis 
{ 
    List<object> _valueList = new List<object>(); 
    UnitValue prevBaseValue; 

    protected override UnitValue GetPlotAreaCoordinate(object value, Range<IComparable> currentRange, double length) 
    { 

     _valueList.Add(value); 
     UnitValue baseValue = base.GetPlotAreaCoordinate(value, currentRange, length); 


     int valueCount = _valueList.Count((x) => x.Equals(value)); 
     if (valueCount == 2)      
      return new UnitValue(baseValue.Value + 27, baseValue.Unit); 

     prevBaseValue = baseValue; 
     return baseValue; 

    } 

    protected override void Render(Size availableSize) 
    { 
     base.Render(availableSize); 
     _valueList.Clear(); 
    } 

} 

"27" è solo un numero che stavo provando. Potresti voler giocare con quello per vedere cosa funziona meglio per te.

return new UnitValue(baseValue.Value + 27, baseValue.Unit); 
+0

Questo sembra aggiungere solo la lunghezza dei pixel alle etichette che può essere ottenuta usando nell'xaml, c'è comunque modo di garantire che il valore '27' sia al centro indipendentemente dal ridimensionamento o dal contesto dati? – Chris

3

Ecco cosa ho ottenuto:

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> 

Grafico:

enter image description here

+0

Ciao, apprezzo la risposta ma questo non risolve il problema che il grafico può essere ridimensionato o il datacontext potrebbe essere molto più grande vedi ref: [link] (https://gyazo.com/e5dd61efb2d74713876f05e878370aca) – Chris