How to change x,y origin of canvas to bottom left and flip the y coordinates?

Question

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)

Answer 1

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.

Answer 2

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

Answer 3

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.

Answer 4

I have been searching for exactly this question for last few minutes, but still there is a problem for me, how can i use these lines that you adviced in my xml file? i am not really experienced about using xml, so could someone help?

" "