Graphing Gradients - help


I am having trouble understanding the way CGContextDrawLinearGradient graphs the x and y points in order to create the ‘bounds’ of the gradient colors.

For example to create the proper gradient in the gold challenge:

CGPoint center; CGPoint top; center.x = rect.origin.x + rect.size.width /2; center.y = rect.origin.y + rect.size.height /2; top.x = rect.origin.x + rect.size.width /2; top.y = rect.origin.y;

Center (50, 50)
Top (50, 0)

If you graph these two points the ‘top’ doesn’t rise on a graph at all, when the center is up and over?

When I change these values to experiment I don’t understand the changes to the gradient at all. I’ve had my fair share of college math courses, but maybe i’m just out of it…


A gradient will fill EVERYTHING - that is, it is completely unbounded. The starting and ending locations just tell you where the colors you chose start to interpolate between values.

So if I make a gradient from (0,0) to (0, 20), I get pixels filled from (-infinty, 0) to (+infinity, 0) with my starting color and then from (-inf, 20) to (+inf, 20) with my ending color. In between, I get an interpolated value from (-inf, y) to (inf, y).

Anything from (-inf, <0) to (+inf, <0) will be the starting color. Anything from (-inf, >20) to (+inf, >20) will be the ending color.