Struggling to get bar chart bars colored.

[Matt Butler]

I am programmatically building my bar chart, but I have been unable to set the colors for the bar chart bars. Any suggestions or ideas? I am using Q2 2011 Telerik Reporting.


private void chart1_NeedDataSource(object sender, EventArgs e)
    {
        /*
            Need to just do two things in the designer        
            1.) AutoLayout = True
            2.) Docking = Fill
         
        */
        DataTable dt = this.rptDt;

        this.chart1.DataSource = dt;
        chart1.Legend.Appearance.GroupNameFormat = "Qtr #VALUE";
        //return;

        //absolutely necessary these two lines of code:
        this.chart1.DataGroupColumn = "qtr";
        this.chart1.PlotArea.XAxis.DataLabelsColumn = "equipment";


        this.chart1.PlotArea.XAxis.AutoScale = true;
        this.chart1.Docking = DockingStyle.Fill;
        this.chart1.ChartTitle.TextBlock.Text = "Quarterly Equipment Failure";

        this.chart1.PlotArea.YAxis.Appearance.MajorGridLines.Visible = false;
        this.chart1.PlotArea.YAxis.Appearance.MinorGridLines.Visible = false;

        this.chart1.PlotArea.XAxis.Appearance.MajorGridLines.Visible = false;
        this.chart1.PlotArea.XAxis.Appearance.MinorGridLines.Visible = false;

        this.chart1.ClearSkin();
        this.chart1.Skin = string.Empty;
        this.chart1.SeriesPalette = string.Empty;

        this.chart1.Style.BackgroundColor = System.Drawing.Color.WhiteSmoke;
        this.chart1.PlotArea.Appearance.FillStyle.MainColor = Color.White;
        this.chart1.PlotArea.Appearance.FillStyle.FillType = Telerik.Reporting.Charting.Styles.FillType.Solid;
        //this.chart1.PlotArea.XAxis.Appearance.LabelAppearance.FillStyle.MainColor = System.Drawing.Color.Black;
        this.chart1.PlotArea.XAxis.Appearance.TextAppearance.TextProperties.Color = System.Drawing.Color.Black;
        this.chart1.PlotArea.YAxis.Appearance.TextAppearance.TextProperties.Color = System.Drawing.Color.Black;

        //chart1.PlotArea.XAxis.Appearance.LabelAppearance.RotationAngle = 180;

        chart1.DefaultType = ChartSeriesType.Bar;
        chart1.SeriesOrientation = ChartSeriesOrientation.Horizontal;
        //chart1.SeriesOrientation = ChartSeriesOrientation.Vertical;

        ChartSeries cs = new ChartSeries();
        ChartSeriesItem csi;// = new ChartSeriesItem();       

        //Make 4 Series that are the Quarters (1,2,3,4)
        for (int i = 1; i < 5; i++)
        {
            cs = new ChartSeries("Qtr " + i.ToString(), ChartSeriesType.Bar);
            //add the new series to the chart:
            switch (i)
            {
                case 1:
                    cs.Appearance.LineSeriesAppearance.Color = System.Drawing.Color.Blue;
                    cs.Appearance.FillStyle.MainColor = System.Drawing.Color.Blue;                    
                    break;
                case 2:
                    cs.Appearance.LineSeriesAppearance.Color = System.Drawing.Color.Red;
                    cs.Appearance.FillStyle.MainColor = System.Drawing.Color.Red;
                    
                    break;
                case 3:
                    cs.Appearance.LineSeriesAppearance.Color = System.Drawing.Color.Yellow;
                    cs.Appearance.FillStyle.MainColor = System.Drawing.Color.Yellow;                    
                    break;
                case 4:
                    cs.Appearance.LineSeriesAppearance.Color = System.Drawing.Color.Green;
                    cs.Appearance.FillStyle.MainColor = System.Drawing.Color.Green;
                    break;
            }

            //make the bars solid instead of gradient
            cs.Appearance.FillStyle.FillType = Telerik.Reporting.Charting.Styles.FillType.Solid;
            cs.Appearance.LegendDisplayMode = ChartSeriesLegendDisplayMode.SeriesName;

            chart1.Series.Add(cs);
        }



        //now add each equipment fail count to the respective quarter:        
        //build the bars manually:
        foreach (DataRow r in dt.Rows)
        {
            //1.) Make a new series item for each new distinct Equipment item:
            csi = new ChartSeriesItem(Convert.ToDouble(r["failcount"]), r["failcount"].ToString());
            csi.Name = r["equipment"].ToString().Trim();

            csi.Appearance.FillStyle.MainColor = System.Drawing.Color.Purple;
            csi.Appearance.FillStyle.FillType = Telerik.Reporting.Charting.Styles.FillType.Solid;

            chart1.Series[Convert.ToInt32(r["qtr"]) - 1].AddItem(csi);
            
        }

        //show the years we used for the data:
        string msg = string.Empty;
        if (this.ReportParameters["YearsUsedInQuery"].Value.ToString().IndexOf("-") > 0)
            msg = "Years ";
        else
            msg = "Year ";

        this.chart1.PlotArea.YAxis.AxisLabel.TextBlock.Text = msg + this.ReportParameters["YearsUsedInQuery"].Value.ToString();
        this.chart1.PlotArea.YAxis.AxisLabel.TextBlock.Appearance.TextProperties.Color = System.Drawing.Color.Black;
        this.chart1.PlotArea.YAxis.AxisLabel.Visible = true;

        //this.chart1.DataSource = dt;
        ///*
        foreach (ChartSeries cs1 in chart1.Series)
        {
            switch (cs1.Index + 1)
            {
                case 1:                     
                    cs1.PlotArea.XAxis.Appearance.Color = System.Drawing.Color.Blue;
                    foreach (ChartSeriesItem ci in cs1.Items)
                    {
                        ci.Appearance.FillStyle.MainColor = System.Drawing.Color.Purple;
                        ci.Appearance.Border.Color = System.Drawing.Color.Purple;
                        ci.Appearance.Exploded = true;
                        ci.Appearance.FillStyle.FillType = Telerik.Reporting.Charting.Styles.FillType.Solid;
                    }
                    break;
                case 2:
                    cs1.PlotArea.XAxis.Appearance.Color = System.Drawing.Color.Red;
                    break;
                case 3:
                    cs1.PlotArea.XAxis.Appearance.Color = System.Drawing.Color.Yellow;
                    break;
                case 4:
                    cs1.PlotArea.XAxis.Appearance.Color = System.Drawing.Color.Green;
                    break;
            }
        }
         //* */
    }

[IvanDT]

Hello Matt,

The problem you have encountered is that when you use the automatic data binding of the Chart item together with the DataGroupColumn property specified, the chart generates its own series for each distinct data group. In this way your chart series are ignored(cleared) together with their custom appearance as you may not know how many groups(series) will be automatically generated.

To customize the chart appearance there are different approaches and they depend on your data structure. If your data is already grouped you can use the "Data Binding Chart to a Database Object" article where you can specify where to get the Y values by setting the DataYColumn property. But if it is not grouped and you want to create custom bar color for each grouped data you could achieve this only by code. You can check the "Graph for each group" forum thread for an example how to create and group the series items programmatically. In the first example you can exclude the ID and X column for your case.

Regards,
IvanDT
the Telerik team