Ichimoku shading

[Justin]

Is there a built-in way or could anybody point me to the right direction to go about creating Ichimoku cloud areas in [presumably] RadChart. For clarification, there's essentially two line series, one green, one red. When the red one's higher, the area between the two is highlighted red, when the green one's higher the area between's highlighted green.

Text version follows; R = red line, r = red shading, G = green line, g = green shading

RRRRRRRR                                                               GGGGGG
rrrrrrrrrrrrrrrrrRRRRRRR                               GGGGGgggggggg
rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrRR               GGGGggggggggggggggg
rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrRGGGGgggggggggggggggggRRR
rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrGGGRggggggggggggggRRRRR
GGGGGGGGGGGGGG           RRRRRRRRRRR

Any help/pointers will be much appreciated.

Justin

[Justin]

FWIW I've gone down a route of overlaid area chart series. This works so long as values remain positive, but fails where one of the values is positive and one's negative.

I've posted code to date, suggestions to further deal with the above issue would be great (more from a puritanical desire than a must have need as I don't expect the issue is consequential to my use case).

using System;
using System.Collections.Generic;
using System.Windows;
using System.Windows.Documents;
using System.Windows.Media;

namespace IchimokuCloudArea
{
  public partial class MainWindow : Window
  {
    public MainWindow()
    {
      InitializeComponent();

      List<IchimokuCloudDataPoint> dataPoints = new List<IchimokuCloudDataPoint>();
      dataPoints.Add(new IchimokuCloudDataPoint(0, 4, 3));
      dataPoints.Add(new IchimokuCloudDataPoint(1, 5, 3));
      dataPoints.Add(new IchimokuCloudDataPoint(2, 5, 3));
      dataPoints.Add(new IchimokuCloudDataPoint(3, 6, 2));
      dataPoints.Add(new IchimokuCloudDataPoint(4, 6, 1));
      dataPoints.Add(new IchimokuCloudDataPoint(5, 7, -1));
      dataPoints.Add(new IchimokuCloudDataPoint(6, 8, 0));
      dataPoints.Add(new IchimokuCloudDataPoint(7, 7, 1));
      dataPoints.Add(new IchimokuCloudDataPoint(8, 6, 3));
      dataPoints.Add(new IchimokuCloudDataPoint(9, 6, 4));
      dataPoints.Add(new IchimokuCloudDataPoint(10, 5, 5));
      dataPoints.Add(new IchimokuCloudDataPoint(11, 4, 5));
      dataPoints.Add(new IchimokuCloudDataPoint(12, 3, 6));
      dataPoints.Add(new IchimokuCloudDataPoint(13, 2, 6));
      dataPoints.Add(new IchimokuCloudDataPoint(14, 2, 7));
      dataPoints.Add(new IchimokuCloudDataPoint(15, 2, 8));
      dataPoints.Add(new IchimokuCloudDataPoint(16, 1, 9));
      dataPoints.Add(new IchimokuCloudDataPoint(17, 0, 10));
      dataPoints.Add(new IchimokuCloudDataPoint(18, -1, 10));
      dataPoints.Add(new IchimokuCloudDataPoint(19, -2, 9));
      dataPoints.Add(new IchimokuCloudDataPoint(20, -2, 6));

      Telerik.Windows.Controls.Charting.DataSeries redSeries = IchimokuSeries(Brushes.LightSalmon);
      Telerik.Windows.Controls.Charting.DataSeries greenSeries = IchimokuSeries(Brushes.LightGreen);
      Telerik.Windows.Controls.Charting.DataSeries baseSeries = IchimokuSeries(Brushes.White);
      baseSeries.Definition.LegendDisplayMode = Telerik.Windows.Controls.Charting.LegendDisplayMode.None;

      foreach (IchimokuCloudDataPoint dp in dataPoints)
      {
        greenSeries.Add(dp.GreenDataPoint);
        redSeries.Add(dp.RedDataPoint);
        baseSeries.Add(dp.BaseDataPoint);
      }

      this.radchart1.DefaultView.ChartArea.DataSeries.Add(redSeries);
      this.radchart1.DefaultView.ChartArea.DataSeries.Add(greenSeries);
      this.radchart1.DefaultView.ChartArea.DataSeries.Add(baseSeries);
    }

    private Telerik.Windows.Controls.Charting.DataSeries IchimokuSeries(Brush brush)
    {
      Telerik.Windows.Controls.Charting.DataSeries result = new Telerik.Windows.Controls.Charting.DataSeries();
      Telerik.Windows.Controls.Charting.AreaSeriesDefinition asd = new Telerik.Windows.Controls.Charting.AreaSeriesDefinition();
      asd.ShowPointMarks = false;
      asd.ShowItemLabels = false;
      asd.ShowItemToolTips = true;
      result.Definition = asd;
      result.Definition.Appearance.Fill = brush;
      return result;
    }
  }

  public class IchimokuCloudDataPoint
  {
    public Double X;
    public Double RedY;
    public Double GreenY;
    public Double BaseY
    {
      get
      {
        return Math.Min(RedY, GreenY);
      }
    }

    public IchimokuCloudDataPoint(Double x, Double redY, Double greenY)
    {
      X = x;
      RedY = redY;
      GreenY = greenY;
    }

    public Telerik.Windows.Controls.Charting.DataPoint RedDataPoint
    {
      get
      {
        return new Telerik.Windows.Controls.Charting.DataPoint(X, RedY);
      }
    }

    public Telerik.Windows.Controls.Charting.DataPoint GreenDataPoint
    {
      get
      {
        return new Telerik.Windows.Controls.Charting.DataPoint(X, GreenY);
      }
    }

    public Telerik.Windows.Controls.Charting.DataPoint BaseDataPoint
    {
      get
      {
        return new Telerik.Windows.Controls.Charting.DataPoint(X, BaseY);
      }
    }
  }
}

[Sia]

Hello Justin,

Why don't you try to use Range Series Definitions and modify your code as follows:

• Creating the range series:

Telerik.Windows.Controls.Charting.DataSeries rangeSeries1 = IchimokuSeries(Brushes.LightSalmon);
Telerik.Windows.Controls.Charting.DataSeries rangeSeries2 = IchimokuSeries(Brushes.LightGreen);

• adding data points to them:

foreach (IchimokuCloudDataPoint dp in dataPoints)
{
    if (dp.GreenDataPoint.YValue >= dp.RedDataPoint.YValue)
    {
        rangeSeries2.Add(new DataPoint()
        {
            XValue = dp.X,
            High = dp.GreenDataPoint.YValue,
            Low = dp.RedDataPoint.YValue
        });
    }

    if (dp.GreenDataPoint.YValue <= dp.RedDataPoint.YValue)
    {
        rangeSeries1.Add(new DataPoint()
        {
            XValue = dp.X,
            High = dp.RedDataPoint.YValue,
            Low = dp.GreenDataPoint.YValue
        });
    }
}

You will get the result in the attached image.

Greetings,
Sia
the Telerik team

[Justin]

Excellent, that's exactly the sort of pointer I needed - hadn't found the RangedDataSeries myself. In addition to your pointer I needed to pull out a few dusty trigonometry functions to locate and add more points to cover zero intercepts, crossovers and inversions to get the right shape on the cloud but all working now.

The code's got a lot bigger so not posting this time the full working version; pity zip's aren't allowed as attachments. If you're interested, ask.

Many thanks again!

[Sia]

Hi Justin,

I am glad to hear that now everything works as expected.

Kind regards,
Sia
the Telerik team