set coordinates on BitMap image in c# WPF

Question

I have a image of a graph in my WPF project, when i click on the image i get the coordinates of the click. I want to change where coordinates (0,0) appears.

From the blue circle to the red circle - see image

graph

            System.Windows.Point p = e.GetPosition(image);
            double pixelWidth = image.Source.Width;
            double pixelHeight = image.Source.Height;
            double x = pixelWidth * p.X / image.ActualWidth;
            double y = pixelHeight * p.Y / image.ActualHeight;

            xgrid.Text = x.ToString();
            ygrid.Text = y.ToString();

How is that possible?

Thanks

Answer 1

You can convert a point from one control's client space to another with UIElement.TranslatePoint :

private void Rectangle_MouseDown(object sender, MouseButtonEventArgs e)
{
    // assuming "this" is the parent
    var parentPoint = e.GetPosition(this);
    Point childPoint = this.TranslatePoint(parentPoint, theChild);
}

Of course, if your chart is a child control then you can just pass that into GetPosition() instead, while keeping the MouseDown handler in the parent:

var childPoint = e.GetPosition(theChild); 

Either way, if you want the vertical axis reversed then adjust the Y value accordingly:

childPoint.Y = theChild.ActualHeight - childPoint.Y - 1;