Windows UWP SFChart - Spalten- oder Balkendiagrammfarbe basierend auf Wert?

Question

Ist es möglich, die Farbe des Balkens basierend auf dem Wert einzustellen, zum Beispiel mein min war 0 und max war 10, wenn mein Wert zwischen 0 und 3 ist, färbt den Balken grün, wenn er zwischen 3 und 7 ist Blau, und wenn es zwischen 7 und 10 ist, wird es gelb.

Answer 1

Ja. Es ist möglich, die Farbe basierend auf dem Wert festzulegen. Wir können Ihre Anforderung erfüllen, indem wir die individuelle Balken-/Spaltenschablonenfarbe anhand der CustomTemplate-Eigenschaft gemäß dem folgenden Code-Snippet anpassen.

Code Snippet [XAML]:

<Grid.Resources> 

<local:ColorConverter x:Key="conv1"/> 

<DataTemplate x:Key="columnTemplate1"> 
<Canvas> 
<Rectangle Canvas.Left="{Binding RectX}" Canvas.Top="{Binding RectY}"  Height="{Binding Height}" 
Width="{Binding Width}" Stretch="Fill" 
Fill="{Binding Converter={StaticResource conv1}}"></Rectangle> 
</Canvas> 
</DataTemplate> 

</Grid.Resources> 

<Grid.DataContext> 
<local:TestingValuesCollection/> 
</Grid.DataContext> 
<syncfusion:SfChart x:Name="chart" > 
<syncfusion:SfChart.SecondaryAxis> 
<syncfusion:NumericalAxis Minimum="0" Maximum="10"/> 
</syncfusion:SfChart.SecondaryAxis> 
<syncfusion:ColumnSeries x:Name="series1" ItemsSource = "{Binding TestingModel}" XBindingPath = "X" 
CustomTemplate="{StaticResource columnTemplate1}" YBindingPath = "Y"> 
</syncfusion:ColumnSeries> 


</syncfusion:SfChart> 

Code Snippet [C#]:

public class ColorConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, string language) 
    { 
     ColumnSegment segment = value as ColumnSegment; 

     //First region value declaration. 
     DoubleRange firstRegion = new DoubleRange(0, 3); 
     SolidColorBrush firstRegionBrush = new SolidColorBrush(Colors.Green); 

     //Second region value declaration. 
     DoubleRange secondRegion = new DoubleRange(3, 7); 
     SolidColorBrush secondRegionBrush = new SolidColorBrush(Colors.Blue); 

     //Third region value declaration. 
     DoubleRange thirdRegion = new DoubleRange(7, 10); 
     SolidColorBrush thirdRegionBrush = new SolidColorBrush(Colors.Yellow); 

     if (segment.YData >= firstRegion.Start && segment.YData <= firstRegion.End) 
      return firstRegionBrush; 
     else if (segment.YData >= secondRegion.Start && segment.YData <= secondRegion.End) 
      return secondRegionBrush; 
     else if (segment.YData >= thirdRegion.Start && segment.YData <= thirdRegion.End) 
      return thirdRegionBrush; 

     return segment.Interior; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, string language) 
    { 
     throw new NotImplementedException(); 
    } 
} 

Wir können der Lage, mehr Region in Konverter hinzuzufügen und das Rück jede Farbe in die Bar/Spalte.

Wir haben diesen Code basierend auf dem y-Achsenwert erstellt. Wenn Ihre Anforderung auf dem X-Achsenwert basiert, müssen Sie segment.XData überprüfen, anstatt segment.YData im Konverter zu überprüfen.