Implementing a Fixed Width RealTime Plot with Static Separators in LiveCharts2

[perkjelsvik]

Version: 2.0.0-rc2
Target Framework: .NET 6.0
Target OS: Windows
Target OS version: 10.0.22000.0
Framework: WPF

---

I'm new to LiveCharts2 to, but I intend to use it to implement a real-time graph of device measurements in a WPF application targeting .NET 6. I aim to achieve a fixed-width real-time plot with static separators to monitor device measurements accurately, similar to the graph shown in this example:

However, when attempting to create my own solution, or when running the official sample, I've encountered a few challenges:

1. Dynamic Resizing: After the plot has reached its threshold it maintains a fixed-size plot as long as new data is coming in at the same pace. However, until it reaches this threshold the plot dynamically resizes, and the separators naturally also moves around a lot, as shown below:

   

2. Separator Movement: Even after reaching a static zoom level, the separators slightly shift, especially noticeable when the window is widened. This effect is more noticeable in my use-case:

   

3. EnableNullSplitting: I want to enable null splitting since there's cases where there will be missing data, but if I add a period of null data in the sample app you can see that the plot starts stretching out when no new data is coming in, and then it quickly jumps when data appears again. It also jumps when null data is leaving the plot and starts dynamically compressing again until it reaches the fixed with again:

   • Appearance of null data:
     

   • Disappearance of null data:
     

What I'm Trying to Achieve:
I want the X-axis to represent a fixed time window (e.g., the last 25 seconds), with data points spaced at fixed intervals, and static separators at key locations (e.g., every 5 seconds). This setup should provide a clear timeline of events without dynamic resizing or separator movement.

Workaround:
For the dynamic resizing and null splitting I've found a workaround. If I add points back in time up until the first point that all have value 0 in the Y-Axis I force the plot to be fixed width. I can also get around the null splitting problem this way. However, this is less than ideal for my usecase.

Questions:

• How can I configure LiveCharts2 to maintain a fixed plot width with static separators, regardless of data transmission intervals?
• Are there specific properties or methods in LiveCharts2 that facilitate this kind of real-time data plotting without dynamic resizing?
• Dealing with irregular data transmission intervals, using null values to fill in the gaps, without triggering resizing of the plot

Any advice or examples for similar challenges would be greatly appreciated!

[perkjelsvik]

I have found a way to lock the axis without adding dummy data to make it full width, but the other issues still persists! And ideally I would like the library to handle the axis limits by simply defining "I want to show the last X seconds of data".

I call this method each time a new point is added:

    private void UpdateXAxisLimit(DateTime dt)
    {
        _customXAxis.MinLimit = dt.Ticks - TimeSpan.FromMilliseconds(25_000).Ticks;
        _customXAxis.MaxLimit = dt.Ticks + TimeSpan.FromMilliseconds(0).Ticks;
    }