Why is my Core Graphics triangle upside down when I draw it?

Question

I use the following code and draws a triangle on the screen. But for some reason, it displays a lower triangle.

Here is the code:

// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code

    CGMutablePathRef path = CGPathCreateMutable(); 
    CGPathMoveToPoint(path,NULL,10.0f, 100.0f); 
    CGPathAddLineToPoint(path,NULL,100.0f,10.0f); 
    CGPathAddLineToPoint(path,NULL,100.0f,100.0f);
    CGPathAddLineToPoint(path,NULL,100.0f,100.0f);
    CGPathCloseSubpath(path); 
    CGContextRef ctx = UIGraphicsGetCurrentContext(); 
    CGContextSetFillColorWithColor(ctx, [UIColor blueColor].CGColor); 
    CGContextAddPath(ctx, path); 
    CGContextFillPath(ctx); 


}

and here is the result:

      /|
     / |
    /  |
   /   |
  /    |
 /__ __|

But when I draw it on paper, I came to this diagram:

   ___________
   \         | 
    \        | 
     \       |
      \      |
       \\     |
          \
            \|

(well, you got the idea right)

What am I missing! Maybe I don’t think directly. x is horizontal and y is vertical. (0,0) is the right start.

Answer 1

The Y axis is upside down in the context in which you are drawing. You can either adapt to this in your math, or apply an affine transformation to flip it back.

Answer 2

iPhone, (0,0) : http://developer.apple.com/iphone/library/documentation/GraphicsImaging/Conceptual/drawingwithquartz2d/dq_context/dq_context.html#//apple_ref/doc/uid/TP30001066-CH203-SW9