0

I have a graph on my WPF to show some plots, the graph is bound to a list called DisplayPoints and when the slider value is changed, one point is moved into DisplayPoints to make it appear on the graph. This is the graphs XAML:

<oxy:Plot Name="Plot" Margin="0,0,10,0" Background="WhiteSmoke">
    <oxy:Plot.Series>
        <oxy:LineSeries ItemsSource="{Binding DisplayPoints}" Color="Transparent" MarkerFill="SteelBlue" MarkerType="Circle"/>
    </oxy:Plot.Series>
    <oxy:Plot.Axes>
        <oxy:LinearAxis Position="Left" Minimum="0" Maximum="{Binding BuildPlateSize}"/>
        <oxy:LinearAxis Position="Bottom" Minimum="0" Maximum="{Binding BuildPlateSize}"/>
    </oxy:Plot.Axes>
</oxy:Plot>

I also have a slider below this graph which controls the % of plots shown on the graph, I am currently handling its events with the ValueChanged event, this is because a requirement is to have the graph update as it is being slide across and not once it has lost focus etc. The XAML for this slider is:

<Slider Name="ProgressSlider" Width="300" Minimum="0" Value="0" Height="30" Foreground="Black" BorderBrush="Black" IsSnapToTickEnabled="True"/>

The maximum is set to however many points the graph has, and creates a tick for each value along the slider. The event handling is as follows:

public async void ProgressSliderEvent(object sender, System.Windows.RoutedPropertyChangedEventArgs<double> e)
    {
        if (e.NewValue > e.OldValue)
        {
            await this.mainWindow.DisplayNewPoint();
        }
        else if (e.OldValue > e.NewValue)
        {
            await this.mainWindow.RemovePoint();
        }

        this.mainWindow.UpdateGUI(e.NewValue);
    }

I am having issues handling the sliding of the slider, when it is slid fast, not all ValueChanges are picked up. For example if I am to control the slider with my arrow keys 100% looks like this: enter image description here

But if I slide it to 100% normal speed it will only loads a portion of the values because I imagine it moves to fast to fire an event for each value passed over: enter image description here

My question is how can I handle my slider's events better in a way that will allow me to slide it across and load all values no matter how fast it moves yet updating the graph in real-time?

Any ideas or help will be greatly appreciated, cheers guys.

J. Scull
  • 309
  • 3
  • 13
  • Rather than posting a whole new question, it would have been better to edit [your previous, identical question](https://stackoverflow.com/a/44581811) to improve it. Either way, you really should have put in some effort to produce an actual [mcve]. As stated, your question is too broad. The basic answer is still the same: you need to interpolate between values you observe. But there are many possible answers to how to do that. – Peter Duniho Jul 20 '17 at 08:36
  • @PeterDuniho So what do you want me to do, I have provided a minimal and complete example? I only included relevant code, for me to create a 'working' example I would need to provide a lot of irrelevant code, and in my opinion that makes the question worse than just having the bare minimum code. I also dont have a lot of time, I thought this would suffice, I tried to make myself as clear as possible, what else can I do? – J. Scull Jul 20 '17 at 08:44
  • Are you expecting to get exactly 100 events if you drag the thumb from the beginning to the end of track when Minimum is set to 0 and Maximum is set to 100 or what is your issue? – mm8 Jul 20 '17 at 09:48
  • @mm8 so I have the slider set to snap to tick and I have one tick per each value, and the max is set to the amount of points on the graph. I expect to get exactly N events where N is the amount of points – J. Scull Jul 20 '17 at 12:04

1 Answers1

1

My question is how can I handle my slider's events better in a way that will allow me to slide it across and load all values no matter how fast it moves yet updating the graph in real-time?

You could calculate the difference between the new value and the old value in your event handler and call your method once for each point that differs. Something like this:

public async void ProgressSliderEvent(object sender, System.Windows.RoutedPropertyChangedEventArgs<double> e)
{
    if (e.NewValue > e.OldValue)
    {
        double diff = e.NewValue - e.OldValue;
        for (double d = 0; d < diff; ++d)
        {
            await this.mainWindow.DisplayNewPoint();
        }
    }
    else if (e.OldValue > e.NewValue)
    {
        double diff = e.OldValue - e.NewValue;
        for (double d = 0; d < diff; ++d)
        {
            await this.mainWindow.DisplayNewPoint();
        }
    }

    this.mainWindow.UpdateGUI(e.NewValue);
}
mm8
  • 163,881
  • 10
  • 57
  • 88
  • This is a good idea, I'm unsure of if this would 'flow' or if it would instantly display a batch of them, however I will try it and I will put a small sleep in the loop. – J. Scull Jul 20 '17 at 12:06
  • 1
    After a bit of work, this seems to work great. Thank you. – J. Scull Jul 20 '17 at 13:38