WPF 绘制点与线时的不同行为

Question

当滚轮移动时，我正在尝试从画布上的图像中心到鼠标位置绘制一条线。

我有一个看起来像这样的函数：

// e is MouseWheelEventArgs
var position = e.GetPosition(canvas);
var x = Canvas.GetLeft(image) + image.ActualWidth / 2;
var y = Canvas.GetTop(image) + image.ActualHeight / 2;

Ellipse point = new Ellipse
{
    Margin = new Thickness(x, y, 0, 0)
};

Line line = new Line
{
    X1 = position.X,
    Y1 = position.Y,
    X2 = x,
    Y2 = y
};

canvas.Children.Add(point);
canvas.Children.Add(line);

点在指针的位置正确绘制，线是从图像中心绘制的，但线绘制到的点不正确。这是为什么呢？

这是显示点和线位置的图像

Answer 1

我建议用几何来实现它。

使用这样的 XAML

<Canvas Background="Transparent" MouseWheel="Canvas_MouseWheel">
    <Image x:Name="image" Canvas.Left="0" Canvas.Top="0" Source="..."/>
    <Path x:Name="line" Stroke="Green" StrokeThickness="2"/>
    <Path x:Name="point" Fill="Red"/>
</Canvas>

事件处理程序可能如下所示：

private void Canvas_MouseWheel(object sender, MouseWheelEventArgs e)
{
    var position = e.GetPosition((Canvas)sender);

    var center = new Point(
        Canvas.GetLeft(image) + image.ActualWidth / 2,
        Canvas.GetTop(image) + image.ActualHeight / 2);

    line.Data = new LineGeometry(center, position);
    point.Data = new EllipseGeometry(position, 3, 3);
}