如何在Image（WPF）中的图像上绘制一个点，运行时使用事件

Question

我有以下问题：我在WPF中使用Image组件。我为我加载了Image map。我想制作一个Button，如果我点击，我将被允许点击我的map并绘制一个点。这一点应该是“唯一的”，所以它应该记住 coordinates / description （我将它存储在数据库中）。 坐标应仅从该图像中读取，而不是从整个表单中读取。 我的点数创建后我需要OnMouseClick个事件。

我应该使用/阅读哪些内容？

Answer 1

1. Canvas允许您使用左/上坐标放置对象。
2. 您需要将画布准确放置在与图像尺寸相同的图像上。
3. 要实现这一点，您应该使用Grid，因为它允许控件相互堆叠。

4. 您可以使用e.GetPosition()事件处理程序中的MouseLeftButtonDown获取鼠标单击坐标。由于画布覆盖了图像，因此您将根据图像获得坐标。

   <Grid>
       <Image x:Name="MapImg"  Source="img/map.gif" Stretch="Fill" MouseLeftButtonDown="Image_MouseLeftButtonDown_1"/>
       <Canvas x:Name="Cnv"/>
   </Grid>
   
    private void Image_MouseLeftButtonDown_1(object sender, MouseButtonEventArgs e)
       {  
           Ellipse ellipse = new Ellipse();
           ellipse.Fill = Brushes.Sienna;
           ellipse.Width = 100;
           ellipse.Height = 100 ;
           ellipse.StrokeThickness = 2;
   
           Cnv.Children.Add(ellipse);
   
           Canvas.SetLeft(ellipse, e.GetPosition(MapImg).X);
           Canvas.SetTop(ellipse, e.GetPosition(MapImg).Y);            
       }