Unable to plot some points on Canvas in WPF
<p>I'm trying to develop a real-time plotting Chart in WPF. For this I've used Canvas and on 500ms interval I'm adding a point to Polyline series. Here I'm clearing previous points after completing plotting in visible screen. So when it happens it 'canClear' will be true.</p>

<p>Please refer below code,
In Xaml.Cs:</p>

<pre><code>public partial class Chart : UserControl
{
    private ChartViewModel _vm;
    public Chart()
    {
        InitializeComponent();
        _vm = new ChartViewModel();
        _vm.DataAddedEvent += _vm_DataAddedEvent;
        this.Loaded += (s, e) =&gt;
            {
                this.DataContext = _vm;
            };
    }

    void _vm_DataAddedEvent(Point pt, bool canClear)
    {
        this.Dispatcher.Invoke(() =&gt;
            {
                if (canClear)
                {
                    this.pointLine.Points.RemoveAt(0);
                }
                this.pointLine.Points.Add(pt);
                this.canVas.UpdateLayout();
            });
    }
}
</code></pre>

<p>In Xaml:</p>

<pre><code>&lt;UserControl x:Class="ChartControl.ChartTool.Chart"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" Background="Blue" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch"&gt;
&lt;Canvas x:Name="canVas" Background="Black" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"&gt;
    &lt;Polyline x:Name="pointLine" Stroke="White" StrokeThickness="1"/&gt;
&lt;/Canvas&gt;
</code></pre>

<p></p>

<p>Viewmodel :</p>

<pre><code>public delegate void DataAdded(Point pt, Boolean canClear);
public class ChartViewModel : BaseViewModel
{
    public event DataAdded DataAddedEvent;
    public ChartViewModel()
    {
        _points = new List&lt;Point&gt;();
        _pointSeries = new PointCollection();
       // _rand = new Random(0);
        _timer = new Timer(OnTimerTick, null, 0, 500);
    }

    private double _x = 20.0;
    private void OnTimerTick(object state)
    {
        _x += 0.01;
        Point pt = new Point(_x, 50);
        _points.Add(pt);
        if (_counter &lt; 100)
        {
            if (DataAddedEvent != null)
            {
                DataAddedEvent(pt, false);
            }
            _counter++;
        }
        else
        {
            if (DataAddedEvent != null)
            {
                DataAddedEvent(pt, true);
            }
        }
    }

   // private Random _rand;
    private int _counter;
    private PointCollection _pointSeries;

    public PointCollection PointSeries
    {
        get { return _pointSeries; }
        set { _pointSeries = value; }
    }

    private Timer _timer;
    private List&lt;Point&gt; _points;
}
</code></pre>

<p>Please suggest me if I'm doing anything wrong here or is there any better way to do this in WPF. (This is only a proof of concept for this charting tool).</p>