0

I need to implement a chart to represent data on a simple X,Y axis, X being time.

Think of e.g. speedtest or RAM usage over time.

When I start drawing, I have no data. As time passes by, more data comes to my set and I can use it to draw chart. Given that I have 1 [X,Y] coordinate for every second, I want to draw this as a continuous line.

Obviously, Bezier curves came to my mind, but the problem is that my points are always changing. At one second I have N points, in the next one N+1. And if I decide to work only with the last M points, this will not be a continuous line. Every time I add a new last point P to my Bezier curve, it changes the curve as a whole, not just the part between P and P-1.

So what is the correct approach to this problem? Is Bezier curve a viable solution with some hack, or do I have to use some other approach?

Thanks!

michnovka
  • 2,880
  • 3
  • 26
  • 58
  • 1
    Bezier curves are in fact kind of a bad choice here, and you probably want Catmull-Rom curves, or even B-splines, instead. Both of those can grow-as-you-add-points. – Mike 'Pomax' Kamermans Jul 10 '19 at 00:04
  • Or a simple moving average. – Nico Schertler Jul 10 '19 at 00:30
  • see [How can i produce multi point linear interpolation?](https://stackoverflow.com/a/30438865/2521214) I would go with **piecewise polynomial interpolation** using interpolation cubics or Catmull-Rom cubics also take a look at this: [Catmull-Rom interpolation on SVG Paths](https://stackoverflow.com/a/30750626/2521214) take a look at the animated gif at the end on how it looks like as you can see the curve start does not change by adding more points to it ... – Spektre Jul 10 '19 at 08:42

0 Answers0