How do I draw a line on WPF drag and drop to the mouse from the drag source?

Question

I'm having some issues translating points. I want to draw a line from the center of the control to the mouse. I'm currently using the GiveFeedback event, mostly because I was able to get some result with it- I have other handlers I'm also using. One note, I have a transparent canvas that covers the entire window area, I refer to it as MainCanvas in this example.

The destination is basically working, which is weird because it's in screen coords. The source point is the problem. If I use screen coords, they originate at the center of the window. If I use TranslateToPoint relative to the MainCanvas/Window then one of the points- the closest to the bottom right- almost looks right, but the others start coming from the left. It's... bizarre. If you all could shed some light on what is happening, I'd be very appreciative. OK, here's some code: (I can provide more, but I'm sure the problem is in something I've shared)

Window window = Window.GetWindow(this);
            Point source = TranslatePoint(new Point(5, 5), window),
                destPoint = App.MainCanvas.PointFromScreen(GetMousePosition(Window.GetWindow(this)));
            if (App.MainCanvas.Children.Contains(_previousLine))
            {
                App.MainCanvas.Children.Remove(_previousLine);
            }
            _previousLine = new Line
            { X2 = source.X, X1 = destPoint.X, Y2 = source.Y, Y1 = destPoint.Y, StrokeThickness = 2.5f, Stroke = Brushes.Black };
            Debug.WriteLine($"Source: {source} Dest: {destPoint}");
            App.MainCanvas.Children.Add(_previousLine);
            base.OnGiveFeedback(e);
        }

Then the BindPoint:

    <UserControl.Resources>
        <Style TargetType="local:BindPoint">
            <Style.Triggers>
                <DataTrigger  Binding="{Binding PointType, RelativeSource={RelativeSource Self}}" Value="Speed">
                    <Setter Property="Border.CornerRadius" Value="0"/>
                    <Setter Property="Border.Background" Value="Goldenrod"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Border Name="Border" CornerRadius="25" Width="10" Height="10" Background="LimeGreen" BorderThickness="2" BorderBrush="Black" DragEnter="UIElement_OnDragEnter" DragLeave="UIElement_OnDragLeave" DragOver="UIElement_OnDragOver" MouseMove="UIElement_OnMouseMove" Drop="UIElement_OnDrop" MouseDown="MouseClick">
            
        </Border>
    </Grid>

</UserControl>

And the Window where all this is happening:

    <Canvas x:Name="SOCanvas">
    <StackPanel>
        <uiXaml:BindPoint/>
        <uiXaml:BindPoint/>
        <uiXaml:BindPoint/>
<StackPanel Orientation="Horizontal">
    <Label Content="Long Label                           "/> 
    <uiXaml:BindPoint/>

</StackPanel>
    </StackPanel>
    </Canvas>
</Window>

Answer 1

The problem was the size of the control wasn't getting propagated- the 10x10 specified in the border was not being applied in MainWindow.xaml or elsewhere. So the source point was coming from whatever boundaries the parent was handing the control. Creating a default style setting the size fixed the issue.

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:local="clr-namespace:UITestNon_Avalonia.UI_Xaml"
                    >
<Style x:Key="{x:Type local:BindPoint}" TargetType="local:BindPoint">
    <Setter Property="Width" Value="10"/>
    <Setter Property="Height" Value="10"/>
</Style>
</ResourceDictionary>