I'm making an app that shows tides. It's approximately a sine wave going smoothly in and out. If I use only the low and high tides times, the line should curve slowly between them. If the first value on the chart is a low tide and the next is a high tide I want the line to start from horizontal, get steeper and then flatten out as the tide peaks. This happens for all the values within the chart except for the first and last because there's no data outside of the chart's range to tell the interpolation code where the line needs to curve to. If I add extra data beyond what I am displaying, the chart adapts and shows that data too, then I have nothing beyond that.
Some pictures might help
Here the first and last points look like the tide is still going down/up rather fast, where as the other points all slow down as they reach the high/low value
I tried using .chartXScale(domain: start...end) to set the bounds of the x-axis, but the chart gets drawn beyond those bounds
I believe I can fake it by adding my own interpolated points just seconds before the first and after the last point with the same value as the true data. This would force the interpolation to flatten out, but I'd rather use the real data and control the chart sounds properly