Column chart Column colors based on value

[Rakesh Patel]

i want to show a Persons height as Column chart

the person has name and height

i am using syncfusion column chart in wpf.

i want set column's background color as dark red when height < 0 and column's background color as dark green when height > 0 for the person

attached is sample chart

can you give me sample code

Attachment: DASHBOARDPNLCHART_65b7a5e2.zip

[Arul Jenith Berkmans]

Hi Rakesh Patel,

We have reviewed your query and would like to inform you to change their color based on a condition (height < 0 or height > 0), you can utilize the SegmentColorPath property. This approach involves binding a color property in your data model and setting that property using logic that depends on the height value.

Here is a simple code example.

C#:

public class ChartViewModel

    {

        public ObservableCollection<PersonData> Data { get; set; }

 

        public ChartViewModel()

        {

            Data = new ObservableCollection<PersonData>

            {

                new PersonData { Name = "John", Height = 170 },

                new PersonData { Name = "Jane", Height = -150 },

                new PersonData { Name = "Doe", Height = 160 },

                new PersonData { Name = "Smith", Height = -180 }

            };

        }

    }

 

 public class PersonData : INotifyPropertyChanged

 {

     private double height;

     private Brush color;

 

     public string Name { get; set; }

 

     public double Height

     {

         get => height;

         set

         {

             if (height != value)

             {

                 height = value;

                 OnPropertyChanged(nameof(Height));

                 UpdateColor();

             }

         }

     }

 

     public Brush Color

     {

         get => color;

         set

         {

             color = value;

             OnPropertyChanged(nameof(Color));

         }

     }

 

     public event PropertyChangedEventHandler PropertyChanged;

 

     private void UpdateColor()

     {

         Color = Height < 0 ? Brushes.DarkRed : Brushes.DarkGreen;

     }

 }

XAML:

<syncfusion:ColumnSeries ItemsSource="{Binding Data}"

                         XBindingPath="Name"

                         YBindingPath="Height"

                         SegmentColorPath="Color"/>

For more details, please visit the document: Appearance in WPF Charts control | Syncfusion

Thank you for your patience and understanding.

Best regards,

Arul Jenith B.