How to Assign Individual Colors to Bars in radhtmlchart?

Question

I am trying to add different colors for each individual bar in radhtmlchart. I tried using below code but it is not working as expected. Any way to achieve this ?

Color[] barColors = new Color[8]{
                       Color.Purple,
                       Color.SteelBlue,
                       Color.Aqua,
                       Color.Yellow,
                       Color.Navy,
                       Color.Green,
                       Color.Blue,
                       Color.Red   };

        for (int i = 0; i < 8; i++)
       {
            BarSeries bs = new BarSeries();
            bs.Appearance.FillStyle.BackgroundColor = barColors[i];
            RadHtmlChartCurrentChart.PlotArea.Series.Add(bs);

        }

RadHtmlChartCurrentChart.DataSource = datatable;
RadHtmlChartCurrentChart.DataBind();

I want graph to look like this.

What exactly does "not working as expected" mean? Fwiw, you're executing `i++` twice each loop, which could lead to issues. — Ben, Jan 24 '19 at 03:30

score 0 · Accepted Answer · answered Jan 24 '19 at 05:15

I found a way to do this.

First add ColorField property to in telerik:ColumnSeries

<telerik:ColumnSeries DataFieldY="ModelPercentage" ColorField="AddColor">

Then define color values in Hex values using string array, code behind.

string[] barColors = new string[8]
            {
                "#ffb128","#ff8828", "#FFFF00", "#808000","#800000","#F333FF","#707AF3","#68E572"
            };

Then add these color values in your data source as a column.

Here I am using data table so I added another column as color values.

CurrentvsPropose.Columns.Add("AddColor", typeof(string));

Adding data to data table before binding.

tableRowCvsP["AddColor"] = barColors[i];

I got the idea from here

How to Assign Individual Colors to Bars in radhtmlchart?

1 Answers1