I'm having a problem that is hard to describe but is quite simple and probably has a simple solution (I'm probably doing something wrong).

I have some data I'd like to display as a stacked area chart. The data comes in the form of a few series, each with values associated with a particular date time. So the X-Axis is the time, and the Y Axis is the value. In a nutshell, the graph is not respecting the XValues I'm assigning for each data point.

I create each series like this:

NAreaSeries areaSeries = (NAreaSeries)Chart.Series.Add(SeriesType.Area);
areaSeries.Name = name;
areaSeries.UseXValues = true;

I then iterate through my data, adding data points like this:

NDataPoint dp = new NDataPoint();
dp[DataPointValue.Value] = value;
dp[DataPointValue.X] = xValue;
series.AddDataPoint(dp);

(value is a double, xValue is a datetime)


Around a certain time of day there is no data available for one of the series. I continue to add data points for the other series, and I'd expect that to show on the graph as zero. I would expect the graph to reflect that at that point on the XAxis - ie at that time of day the series is not visible / has no area on the graph.

But instead, that series shows as having values at that time of day - it just takes the data from later on in the day and shows it at that time - it does not respect the xValue I've assigned above. It "runs out" of data towards the right hand side of the graph, so it's showing as having no data later on in the day, even though there is.

Hope I've explained this clearly. How should I be adding data to the series so that if there's no data points for a certain period of time, the graph shows that instead of just taking the next available data point in the series (which is for a different time).

I can reproduce this with a simple example. Create a new Windows Forms app and attach an event handler to the 'Shown' event with the following code.

void Form1_Shown(object sender, EventArgs e)
{
NChartControl ChartHolder = new NChartControl();
Controls.Add(ChartHolder);
ChartHolder.Dock = DockStyle.Fill;

NChart Chart = new NCartesianChart();
ChartHolder.Charts.Add(Chart);

NAreaSeries Germany = (NAreaSeries)Chart.Series.Add(SeriesType.Area);
Germany.DataLabelStyle.Visible = false;
Germany.MultiAreaMode = MultiAreaMode.Stacked;
Germany.UseXValues = true;
Germany.FillStyle = new NColorFillStyle(Color.Red);

NAreaSeries France = (NAreaSeries)Chart.Series.Add(SeriesType.Area);
France.DataLabelStyle.Visible = false;
France.MultiAreaMode = MultiAreaMode.Stacked;
France.UseXValues = true;
France.FillStyle = new NColorFillStyle(Color.Blue);

int franceValue = 80;
int germanyValue = 50;

DateTime now = DateTime.Now;

for (int i = 0; i < 30; i++)
{
int numMinutes = i*5;
int points = i*2;

France.AddDataPoint(new NDataPoint(franceValue - points));
France.XValues.Add(now.AddMinutes(numMinutes));

if (i < 9 || i > 15)
{
Germany.AddDataPoint(new NDataPoint(germanyValue));
Germany.XValues.Add(now.AddMinutes(numMinutes));
}
}

NAxis axis = Chart.Axis(StandardAxis.PrimaryX);
NRangeTimelineScaleConfigurator timelineScale = new NRangeTimelineScaleConfigurator();
axis.ScaleConfigurator = timelineScale;
}


This displays a simple graph with Germany in red and France in blue. Although Germany is missing some values (it skips the iterations between 9 and 15), the Nevron Chart shows data for Germany over the entire time.

If you change the order that the series' are added, so that France is added first, the German area is truncated.

Hi David,

The chart simply has no enough data to stack correctly the two areas - you need to add values to germany (as it is the master of the stack and therefore the chart will not plot anything for data points where the master series values are invalid:

   NChartControl ChartHolder = nChartControl1;
   ChartHolder.Panels.Clear();
   ChartHolder.Dock = DockStyle.Fill;

   NChart Chart = new NCartesianChart();
   Chart.BoundsMode = BoundsMode.Stretch;
   ChartHolder.Charts.Add(Chart);

   NAreaSeries Germany = (NAreaSeries)Chart.Series.Add(SeriesType.Area);
   Germany.DataLabelStyle.Visible = false;
   Germany.MultiAreaMode = MultiAreaMode.Stacked;
   Germany.UseXValues = true;
   Germany.FillStyle = new NColorFillStyle(Color.Red);

   NAreaSeries France = (NAreaSeries)Chart.Series.Add(SeriesType.Area);
   France.DataLabelStyle.Visible = false;
   France.MultiAreaMode = MultiAreaMode.Stacked;
   France.UseXValues = true;
   France.FillStyle = new NColorFillStyle(Color.Blue);

   int franceValue = 80;
   int germanyValue = 50;

   DateTime now = DateTime.Now;

   for (int i = 0; i < 30; i++)
   {
    int numMinutes = i * 5;
    int points = i * 2;

    now = now.AddMinutes(numMinutes);
    double oaNow = now.ToOADate();

    France.AddDataPoint(new NDataPoint(franceValue - points));
    France.XValues.Add(oaNow);

    if (i < 9 || i > 15)
    {
     Germany.AddDataPoint(new NDataPoint(germanyValue));
     Germany.XValues.Add(oaNow);
    }
    else
    {
     Germany.Values.Add(DBNull.Value);
     Germany.XValues.Add(oaNow);
    }
   }

   NAxis axis = Chart.Axis(StandardAxis.PrimaryX);
   NRangeTimelineScaleConfigurator timelineScale = new NRangeTimelineScaleConfigurator();
   axis.ScaleConfigurator = timelineScale;

Note that when you pass null values the chart will treat them differently from 0 (which may be the way to go here if you want more "common" visual results).

Hope this helps - let me know if you have any questions or meet any problems.

Best regards,
Bob

That does help. I thought the chart would be able to extrapolate the missing data points as it does for line graphs, but adding in 0 at these points works well. I've noticed adding in DBValue.Null causes some display artifacts - not a problem, I'l just use 0.

Is there an advantage in converting the datetime value to a double? The Chart tool seems to handle a datetime object passed in as an x value.

Hi David,

There is no particular advantage - it will always be converted to double internally - I converted it in the snippet in order to avoid a redundant ToOADate() call.

Best regards,
Bob