Linechart over stream of numbers

Mar 29, 2012 at 12:02 PM

I'd like to make a linechart over a stream of numbers that continuously get's generated. Sort of like a cpu-usage graph or something along those lines; where the new data enters on the right side, and the old data exits on the left. Also, I do not know beforehand the maximum number that will be generated in this series (but I do know it will never be below 0). What I tried so far was something like this:

        private class NetworkPlotModel : PlotModel
        {
            private LineSeries ups, downs;
            private LinearAxis vax;
            public NetworkPlotModel()
            {
                Axes.Clear();
                Axes.Add(new TimeSpanAxis(pos: AxisPosition.Bottom, title: "Time", min: -60, max: 0));
                Axes.Add(vax = new LinearAxis(AxisPosition.Right, "Value"));
                vax.MaximumPadding = 0.03;

                Series.Add(ups = new LineSeries(OxyColor.FromRGB(1, 0, 0), strokeThickness: 3, title: "Up"));
            }

            public void Push(TimeSpan delta, double up)
            {
                for (int i = 0; i < ups.Points.Count; i++)
                {
                    IDataPoint p = ups.Points[i];
                    ups.Points[i] = new DataPoint(p.X - delta.TotalSeconds, p.Y);
                }
                ups.Points.Add(new DataPoint(0, up));
                this.Update(true);
            }
        }

However, this does not seem to draw a line at all (even though I call the Push-method 1 time, 100 times or 1000 times, and I've also tried to call it once a sec, and up to 10 times a second).

Could I please get an example of how to make something like this work?

Mar 29, 2012 at 1:36 PM

I implemented something similar using an observable. Here is the code below, which might give you a few hints.

Random rand = new Random();

Observable.Interval(TimeSpan.FromSeconds(0.1)).Where( x => x < 100).Subscribe( x => 
		{
			var series = ((LineSeries) pm.Series[0]);
			
			if( x > 50)
			{
				// Remove the first point in the series when we readh 50 data points.
				series.Points.RemoveAt(0);
				
				// Reset the minimum value on the xAxis.
				pm.Axes[0].Minimum = series.Points[0].X;
			}
			
			// Add the new point
			series.Points.Add( new DataPoint(3 + x, rand.Next(10)));
			
			// Set maximum value
			pm.Axes[0].Maximum = x;
			
			// Need to reset the xAxis for it refresh properly
			((LineSeries) pm.Series[0]).XAxis.Reset();
			
			plotControl.Refresh();
		}
	);

 

I think the PlotModel class also has a .Refresh() method.

Coordinator
Mar 30, 2012 at 12:16 PM

PlotModel.Update updates the model, but does not refresh the plot control.

Use PlotControl.Refresh or PlotModel.Refresh to redraw the plot.

Will add examples on the wiki page http://oxyplot.codeplex.com/wikipage?title=Refreshing%20a%20plot

Mar 30, 2012 at 12:47 PM

Thank you :)