Areaseries: Use horizontal axis as origin of coloring

3 posts, 0 answers
  1. Christian
    Christian avatar
    17 posts
    Member since:
    May 2016

    Posted 20 Sep 2016 Link to this post


    I am trying to snap the coloring of area series around to horizontal axis. The first pic (Area Coloring) illustrates what I've got, Area Color Goal what I'd like to see. I've already tried to split negative values from positives, like this, but the result is the same in winforms.

    Please advise.

    Best Regards.

  2. Dess | Tech Support Engineer, Sr.
    Dess | Tech Support Engineer, Sr.  avatar
    4168 posts

    Posted 21 Sep 2016 Link to this post

    Hello Christian,

    Thank you for writing.  

    The possible solution that I can suggest to achieve the illustrated screenshot is to combine two RadChartView controls and split the data in different series. The second chart will use an inverse axis to display the negative values. Here is a sample code snippet which result is illustrated on the attached screenshot: 
    public Form1()
        AreaSeries areaSeries = new AreaSeries();
        areaSeries.DataPoints.Add(new CategoricalDataPoint(13, DateTime.Now.AddDays(1)));
        areaSeries.DataPoints.Add(new CategoricalDataPoint(17, DateTime.Now.AddDays(2)));
        areaSeries.DataPoints.Add(new CategoricalDataPoint(2, DateTime.Now.AddDays(3)));
        for (int i = 4; i < 7; i++)
            areaSeries.DataPoints.Add(new CategoricalDataPoint(null, DateTime.Now.AddDays(i)));
        AreaSeries areaSeries2 = new AreaSeries();
        for (int i = 1; i < 4; i++)
            areaSeries2.DataPoints.Add(new CategoricalDataPoint(null, DateTime.Now.AddDays(i)));
        areaSeries2.DataPoints.Add(new CategoricalDataPoint(2, DateTime.Now.AddDays(4)));
        areaSeries2.DataPoints.Add(new CategoricalDataPoint(13, DateTime.Now.AddDays(5)));
        areaSeries2.DataPoints.Add(new CategoricalDataPoint(13, DateTime.Now.AddDays(6)));
        AreaSeries areaSeries3 = new AreaSeries();
        areaSeries3.DataPoints.Add(new CategoricalDataPoint(2, DateTime.Now.AddDays(7)));
        areaSeries3.DataPoints.Add(new CategoricalDataPoint(4, DateTime.Now.AddDays(8)));
        areaSeries3.DataPoints.Add(new CategoricalDataPoint(5, DateTime.Now.AddDays(9)));
        for (int i = 10; i < 12; i++)
            areaSeries3.DataPoints.Add(new CategoricalDataPoint(null, DateTime.Now.AddDays(i)));
        AreaSeries areaSeries4 = new AreaSeries();
        for (int i = 7; i < 10; i++)
            areaSeries4.DataPoints.Add(new CategoricalDataPoint(null, DateTime.Now.AddDays(i)));
        areaSeries4.DataPoints.Add(new CategoricalDataPoint(13, DateTime.Now.AddDays(10)));
        areaSeries4.DataPoints.Add(new CategoricalDataPoint(11, DateTime.Now.AddDays(11)));
        CategoricalAxis horizontalAxis1 = this.radChartView1.Axes[0] as CategoricalAxis;
        horizontalAxis1.LabelFormat = "{0:dd/MM}";
        CategoricalAxis horizontalAxis2 = this.radChartView2.Axes[0] as CategoricalAxis;
        horizontalAxis2.VerticalLocation = AxisVerticalLocation.Top;
        horizontalAxis2.LabelFormat = "{0:dd/MM}";
        horizontalAxis2.ForeColor = Color.Transparent;
        horizontalAxis2.LineWidth = 0;
        horizontalAxis2.TickWidth = 0;
        LinearAxis verticalAxis = this.radChartView2.Axes[1] as LinearAxis;
        verticalAxis.IsInverse = true;
        verticalAxis.LabelFormatProvider = new MyFormatProvider();
        this.radChartView1.View.Margin = new Padding(10, 0, 10, -5);
        this.radChartView2.View.Margin = new Padding(10, -10, 10, 0);
        this.radSplitContainer1.SplitterWidth = 0;
    public class MyFormatProvider : IFormatProvider, ICustomFormatter
        public object GetFormat(Type formatType)
            return this;
        public string Format(string format, object arg, IFormatProvider formatProvider)
            return "-" + arg.ToString();

    The following help articles are quite useful for achieving this result:

    I hope this information helps. Should you have further questions I would be glad to help.

    Telerik by Progress
    Check out the Windows Forms project converter, which aids the conversion process from standard Windows Forms applications written in C# or VB to Telerik UI for WinForms.For more information check out this blog post and share your thoughts.
  3. Christian
    Christian avatar
    17 posts
    Member since:
    May 2016

    Posted 22 Sep 2016 Link to this post

    Hi Dess,

    thank you for the quick and elaborate answer. Unfortunately this solution is suboptimal, hence I decided to rebuild the report with WPF.

    Best regards,


Back to Top