Could the curve graph be periodic?

[hacker0limbo]

First of all, thanks for building such amazing library.

I am wondering could the curve being periodic? I see there is a config called extendedDomain, which allows the graph to be extended infinitely from x axis direction. However, in the y axis direction the value will be automatically increased to infinite if there is no knots existed, which isn't expected from my point.

As you can see after the last knot, the curve is trying to reach infinite.

What i expected is the curve could be periodic, giving a simple example:

say i configured like this:

const state = {
  knots: [
    { x: 0.1, y: 5 },
    { x: 0.6, y: 10 },
    { x: 0.8, y: 3 },
  ],
  xMin: 0,
  yMin: 1,
  // ...other configs
}

so the period would be 1, since on x axis, from 0 to 0.1 and 0.8 to 1, there isn't any knots. If you want the curve to be extended periodically, two "fake" knots should be established to help build the complete curve:

{ x: -0.2, y: 3 }
{ x: 1.1, y: 5 }

Obviously those two knots wouldn't be displayed in the curve, it is only used for extending the curve domain.

Example periodic curve demo might look like this:

Red points are knots, from 0 to 3 and from 18 to 24, the curve are extended to be periodic.

So just wondering if this library could support such config, i am not an expert and i read the source code but still have no idea how to customize it.

Forgive me with my poor english, i hope i expressed my confusion clearly.

[chdh]

I understand the idea.
We could add a flag and call it "wrap", "loop" or "periodic".
You are right. "Fake" or "mirror" knots could be used to compute the curve.
I would not use xMin and xMax to define the x value range of the period, because xMin/xMax vary when the user moves the viewport. But relevantXMin and relevantXMax could be used instead.

I will think about how to implement this.

[hacker0limbo]

I understand the idea. We could add a flag and call it "wrap", "loop" or "periodic". You are right. "Fake" or "mirror" knots could be used to compute the curve. I would not use xMin and xMax to define the x value range of the period, because xMin/xMax vary when the user moves the viewport. But relevantXMin and relevantXMax could be used instead.

I will think about how to implement this.

Thanks for your reply!

Looking forward to see this new feature implemented in the future

[hacker0limbo]

Also, could the x-axis and y-axis display be customized? For example, in my scenario, usually x-axis would be timestamp(e.g.1674888771553), but we want to display it as regular time string using momentjs(moment().format('YYYY-MM-DD HH:mm:ss'))