Default coordinate system and customer coordinate system in WPF

---

For 2D graphics, the WPF coordinate system locates the origin in the upper-left corner of the rendering area. In the 2D space, the positive X-axis points to the right, and the positive Y-axis points to downward, as shown below:

Now we will create our own coordinate system, we want to move the origin from the top-left corner to the bottom-left corner of the canvas, This system can be easily created in WPF by directly performing corresponding transformations to the canvas.

Here is a sample:

<Window x:Class="sample" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
Title="Line In Custom System" Height="240" Width="220">
<Border BorderBrush="Black" BorderThickness="1" 
  Height="200" Width="200">
<Canvas Height="200" Width="200">
<Canvas.RenderTransform>
<TransformGroup>
<ScaleTransform ScaleY="-1" />
<TranslateTransform Y="200" />
</TransformGroup>
</Canvas.RenderTransform>
<Line X1="0" Y1="0" X2="100" Y2="100" 
  Stroke="Black" StrokeThickness="2" />
</Canvas>
</Border>
</Window>

The new coordinate system shown by following:

The above content refers to the book "Practical WPF Graphics Programming".