WPF. Axis system

Question

How to change axis system in the WPF canvas?

Answer 1

Charles Petzold shows how you can do this with a render transform in his great book Applications = Code + Markup.

On page 844 and following, there is a nice little sample application that he has titled Canvas Modes that illustrates how to do it. But basically, you will want to use a ScaleTransform and a TranslateTransform.

To make the origin the center of the Canvas with Y values going down:

<Canvas>
    <Canvas.RenderTransform>
        <TranslateTransform X="ActualWidth/2" Y="ActualHeight/2"/>
    </Canvas.RenderTransform>
</Canvas>

To make the origin the center of the Canvas but with Y values going up:

<Canvas>
    <Canvas.RenderTransform>
        <TransformGroup>
            <ScaleTransform ScaleX="1" ScaleY="-1"/>
            <TranslateTransform X="ActualWidth/2" Y="ActualHeight/2"/>
        </TransformGroup>
    </Canvas.RenderTransform>
</Canvas>

Of course, I'm using a little bit of pseudo code here for ActualWidth and ActualHeight ...