Drawing lines and ellipses using ObservableCollection and ItemsControl - wpf

Question

I'm trying to draw a set of lines between Ellipses on a canvas. I do this in two steps:
The first section in the XAML below with the ItemsControl bound to 'SingleCL' visualizes the lines using the nested ItemsControl, bound to 'Points'.
The second section, bound tot he same collections, visualizes the ellipses.
'SingleCL' and 'Points' are both ObservableCollection< T >
The Point-class have four properties: VisualHorPos, VisualVerPos, CenterHorPos and CenterVerPos and implements INotifyPropertyChanged. The properties represents X,Y, with the 'Visual'-properties adjusted to represent the upper left corner of the view when placed on a canvas so that when moved around with the mouse, the center is placed where the mouse pointer is.
The points are sorted by their Y-values in their respective collection so that the lines are drawn from bottom to top.
To avoid (hide) the first line that would be drawn from 0,0 to x2,y2 for the very first point in the Point-collection, I'm using a PriorityBinding so that it gets a length of 0, thus in practice hiding it.
The result is the red zig-zag line shown in this image
Adding points below (image wise) - first in the collection - only the ellipses appears, see the blue dots in the image above. If I save the data and reload it from scratch, the lines appear as expected.
Adding points above (image wise) - after another point in the collection - lines are drawn correctly, but the existing lines are not updated to take the new point into account.
I have verified that the points are correctly sorted, both when adding new and when they are moved along the Y-axis.
Perhaps I am asking too much from WPF, but I expected it to draw the lines from point to point, based on the order of the items in the ObservableCollection< T > 'Points' when adding new points, not just the when the binding happens. Also, when moving the points, I expected the lines to refresh so that they always are drawn from bottom to top based on the order in the collection.
The way I see it, the problem is that once the Lines have been created, they are not rebound when objects are moved or added in the collection. Is there a way to make the ItemsControl reevaluate all its items on each Moved/Added/Removed action in the underlying ObservableCollection< T > ?
The "drawing code"
<ItemsControl ItemsSource="{Binding SingleCL}">
<ItemsControl.LayoutTransform>
<TransformGroup>
<ScaleTransform ScaleX="{Binding ElementName=imageZoom, Path=Value}" ScaleY="{Binding ElementName=imageZoom, Path=Value}"/>
</TransformGroup>
</ItemsControl.LayoutTransform>
<ItemsControl.ItemTemplate>
<DataTemplate>
<ItemsControl ItemsSource="{Binding Points}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemTemplate>
<DataTemplate>
<Line X2="{Binding CenterHorPos, Mode=OneWay}" Y2="{Binding CenterVerPos, Mode=OneWay}" Stroke="{Binding Color}" StrokeThickness="2">
<!-- Bind X1,Y1 to the previous point, or if not available (as for the first data item) to the same as X2,Y2 -->
<Line.X1>
<PriorityBinding>
<Binding Path="CenterHorPos" RelativeSource="{RelativeSource PreviousData}"/>
<!-- This is the value used of the first binding doesn't work -->
<Binding Path="CenterHorPos"/>
</PriorityBinding>
</Line.X1>
<Line.Y1>
<PriorityBinding>
<Binding Path="CenterVerPos" RelativeSource="{RelativeSource PreviousData}"/>
<!-- This is the value used of the first binding doesn't work -->
<Binding Path="CenterVerPos"/>
</PriorityBinding>
</Line.Y1>
</Line>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
<!-- Display markers for all centerlines -->
<ItemsControl ItemsSource="{Binding SingleCL}">
<ItemsControl.LayoutTransform>
<TransformGroup>
<ScaleTransform ScaleX="{Binding ElementName=imageZoom, Path=Value}" ScaleY="{Binding ElementName=imageZoom, Path=Value}"/>
</TransformGroup>
</ItemsControl.LayoutTransform>
<ItemsControl.ItemTemplate>
<DataTemplate>
<ItemsControl ItemsSource="{Binding Points}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style>
<Setter Property="Canvas.Left" Value="{Binding VisualHorPos}" />
<Setter Property="Canvas.Top" Value="{Binding VisualVerPos}" />
</Style>
</ItemsControl.ItemContainerStyle>
</ItemsControl>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
And the code for the ellipses:
<UserControl x:Class="SMT.View.AutoCalibration.AutoCalibrationMarkerView"
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"
d:DesignHeight="300" d:DesignWidth="300" MouseDown="MarkerMouseDown"
MouseUp="MarkerMouseUp"
MouseMove="MarkerMouseMove" Width="10" Height="10"
Background="Transparent">
<Grid Background="Transparent">
<Line X1="0" Y1="5" X2="10" Y2="5" Fill="{Binding Color}" Stroke="{Binding Color}" StrokeThickness="0.5"/>
<Line X1="5" Y1="0" X2="5" Y2="10" Fill="{Binding Color}" Stroke="{Binding Color}" StrokeThickness="0.5"/>
<Ellipse Width="10" Height="10" Stroke="{Binding Color}" StrokeThickness="0.5" Fill="Transparent"/>
</Grid>
Workaround/Solution
As also proposed by #Juan Pablo Garcia Coello in the comments, I ended up with to different collections for the ellipses and lines, the latter one being cleared and refilled as needed.