How to change x,y origin of canvas to bottom left

问题:

I have a bunch of data points that I would like to two-way bind to points on a canvas.

The points assume larger y values are reflected in an upwards direction like most math graphs.

How do I change the x,y origin of the canvas to the bottom left corner and reverse it's interpretation of the y coordinate?

(I would like to stay in XAML)

回答1:

<Canvas>
    <Canvas.LayoutTransform>
        <ScaleTransform ScaleX="1" ScaleY="-1" CenterX=".5" CenterY=".5" />
    </Canvas.LayoutTransform>
</Canvas>

回答2:

I tried the ScaleTransform method extensively: It does not work. It only shifts one of the 2 coordinates, never both. This, however, works as advertised:

<Canvas Name="myCanvas" Width="0" Height="0" RenderTransform="1 0 0 -1 0 0"
    HorizontalAlignment="Center" VerticalAlignment="Center" >

回答3:

If you use databinding you can use a TypeConvertor, but for that you have to go outside the XAML and you need to know the size of the canvas beforehand.

回答4:

I'd probably create a custom panel instead of using Canvas and give it the attached properties that make sense for your needs. Here is an example of implementing a custom panel:

http://blog.boschin.it/articles/silverlight-radialpanel.aspx

Something like Canvas is very simple since you don't have to do much in the measure and arrange overrides.

You may also be able to inherit from Canvas and override ArrangeOverride, I haven't tried that but it may work.