Color space on iphone

Discussion in 'iOS Programming' started by THEDEAN911, Oct 21, 2013.

  1. THEDEAN911 macrumors newbie

    Feb 13, 2010
    I have a X and Y plane with values 0,0 - 160,160. Each point has a value that ranges from 0 to a peak value. I'm trying to display the points in a grid with the point's value represented by colors, like a heat map. How do I create a color space on the iphone that has good contrast and I can move across the color space using the point's value? I have created the grid of points using the following code, i've been experimenting with math to create an RGB color for each point with little success.

    for (int x = 0; x < (gridsize * res); x ++) {
                for (int y = 0; y < (gridsize * res); y ++) {
                    fx = (float) x / (float) res;
                    fy = (float) y / (float) res;
                    subrect = rectsize/res;
                    points[x][y] = #math to create value
                    CGContextSetRGBFillColor(c, (points[x][y]/coords[3]), 0.0, 0.0, 1.0f);
                    CGContextFillRect(c, CGRectMake((x*subrect+160), (y*subrect+160), subrect, subrect));
                    CGContextFillRect(c, CGRectMake((x*-subrect+160), (y*-subrect+160), subrect, subrect));
                    CGContextFillRect(c, CGRectMake((x*-subrect+160), (y*subrect+160), subrect, subrect));
                    CGContextFillRect(c, CGRectMake((x*subrect+160), (y*-subrect+160), subrect, subrect));
    What's the easiest way to create a color space with high contrast? I've googled around but couldn't find anything for iphone, only color programming on the mac. Please point me in the right direction and I can start figuring it out.

  2. Duncan C macrumors 6502a

    Duncan C

    Jan 21, 2008
    Northern Virginia
    I seriously doubt if you want to create your own color model, like RGB, HSB, LAB, CMYK, or the like, and implement everything that would be required to let you draw in that colorspace. You should expect to spend like 6 months laying the groundwork for something like that, and that's assuming you know a lot about Apple's drawing engine.

    I would suggest using the HSB model, locking saturation to a fairly high value, and using hue and brightness as your x and y values. You'll probably want to limit the brightness range so you don't go too close to black, because you won't be able to see the hue in very dark colors.

    Several years ago I found code on the 'net that showed how to map HSB values back and forth to RGB and I used that approach for an app I was writing. I let the users input values in HSB, and converted the results to RGB values. You could do the same thing. Play with the color picker in Mac OS (which has an HSB mode) to see if that will work for you.
  3. THEDEAN911 thread starter macrumors newbie

    Feb 13, 2010
    Thanks for the response. So there's no API or something in UIColor to create a heatmap more easily?
  4. xArtx macrumors 6502a

    Mar 30, 2012
    So you just want to step through a range of nice colours that blend into each other?
  5. ArtOfWarfare macrumors G3


    Nov 26, 2007
    Unless I'm mistaken, OpenGL allows you to specify vertex colors and it'll automatically blend in the space between them. Other than that, nope, I have nothing better. Although I would suggest that, if your heatmap is always the same, you're probably better off prerendering it, saving it as a png resource, and then loading it up in a UIImage.
  6. xArtx macrumors 6502a

    Mar 30, 2012


    include this:

    float rcolours[256];
    float gcolours[256];
    float bcolours[256];
    int redfactor = 1, greenfactor = 2, bluefactor = 3;
    int redphase = 0, greenphase = 50, bluephase = 100;
    int ptime = 0;
    void shades_generate(int ptime)
        int i;
        unsigned red, green, blue;
        unsigned r = ptime * redfactor + redphase;
        unsigned g = ptime * greenfactor + greenphase;
        unsigned b = ptime * bluefactor + bluephase;
        // iOS implementation
        for(i=0; i < 256; ++i) {
        r &= 0xFF; g &= 0xFF; b &= 0xFF;
        red = 2 * r;
        if (red > 255)
        red = 510 - red;
        green = 2 * g;
        if (green > 255)
        green = 510 - green;
        blue = 2 * b;
        if (blue > 255)
        blue= 510 - blue;
        rcolours[i] = red;
        gcolours[i] = green;
        bcolours[i] = blue;
        r++; g++; b++;
    do this to generate the shade table:

        redfactor   = rand()%4;
        greenfactor = rand()%4;
        bluefactor  = rand()%4;
        redphase    = rand()%256;
        greenphase  = rand()%256;
        bluephase   = rand()%256;
    now the third colour in the 256 colour table (floats) is:
    If you don't like the first table do the second chunk
    of code however many times it takes, or alter it.
  7. xArtx macrumors 6502a

    Mar 30, 2012
  8. Duncan C macrumors 6502a

    Duncan C

    Jan 21, 2008
    Northern Virginia
    Wait. It sounds like your problem is simpler than I thought at first. You want to represent values in a linear range, from say 0 to 255?

    That should be easy to do. How many uniquely identifiable steps do you have to show?
  9. xArtx macrumors 6502a

    Mar 30, 2012
    If it's only two colours couldn't you draw a gradient in the background with Quartz,
    and draw the graph to mask it to cover what you don't want to see?

Share This Page