Bar Chart with different color

[Karthik Kantharaj]

Hi guys

I have one requirement
I saw below link

http://www.telerik.com/help/reporting/buildingdatabinddatabase.html

In that all bars are in same color(Grey) can i have different colors for individual bar



above all in one group
and i know if we have different group we can get different colors but i dont want different groups


Karthik.K

[A2H]

Hello,

You can assign different colors to bar chart by looping the items in a series (group) and assign the colors based on that.

Please try the below implementation

protected void Page_Load(object sender, EventArgs e)
   {
       var ChartDT = this.GenerateDataTable();
       TestChart.ChartTitle.TextBlock.Text = "Test Method";
       TestChart.DataSource = ChartDT;
       TestChart.PlotArea.XAxis.AxisLabel.Visible = true;
       TestChart.PlotArea.YAxis.AxisLabel.Visible = true;
       ChartSeries series = new ChartSeries();
       series.Type = ChartSeriesType.Bar;
       foreach (DataRow dtRow in ChartDT.Rows)
       {
           ChartSeriesItem chartSeriesItem = new ChartSeriesItem();
           chartSeriesItem.YValue = Convert.ToDouble(dtRow["Value"]);
           chartSeriesItem.Name = (string)dtRow["Test"];
           series.AddItem(chartSeriesItem);
       }
       TestChart.Legend.Appearance.Position.AlignedPosition = Telerik.Charting.Styles.AlignedPositions.TopRight;
       TestChart.AutoLayout = true;
       TestChart.DataBind();

       Color[] barColors = new Color[9]
       {
              Color.Purple,
              Color.SteelBlue,
              Color.Aqua,
              Color.Yellow,
              Color.Navy,
              Color.Green,
              Color.Blue,
              Color.Red,
              Color.AliceBlue
          };
       //Assingning the color to bars
       foreach (ChartSeriesItem item in TestChart.Series[0].Items)
       {
           item.Appearance.FillStyle.MainColor = barColors[item.Index];
       }
   }
   private DataTable GenerateDataTable()
   {
       var dt = new DataTable();

       dt.Columns.Add("Test");
       dt.Columns.Add("Value");

       dt.Rows.Add("Test1", 100);
       dt.Rows.Add("Test2", 10);
       dt.Rows.Add("Test3", 30);
       dt.Rows.Add("Test4", 95);
       dt.Rows.Add("Test5", 130);

       return dt;
   }

Refer this link for additional reference

Thanks,
A2H