Creating a color palette from an image

Question

Just for fun, I was looking for how to use the GD library to create a color palette from an image. So far, I have used GD to resize a user's uploaded image to an appropriate size to display on a web page.

Now I would like to get about five different colors from an image representing the range of colors present in it. Once I have done this, I would like to create an additional palette based on these colors, which I can then use for colored elements on the page.

Any help I can get about how I can find the initial color palette will be greatly appreciated!

EDIT: I came to my own decision, which you can see below.

Answer 1

Well, I spent a couple of days playing, and I managed to create my own color palette. It worked pretty well for me, and you can resize the color palette to return more or less colors from the image.

// The function takes in an image resource (the result from one
// of the GD imagecreate... functions) as well as a width and
// height for the size of colour palette you wish to create.
// This defaults to a 3x3, 9 block palette.
function build_palette($img_resource, $palette_w = 3, $palette_h = 3) {
    $width = imagesx($img_resource);
    $height = imagesy($img_resource);

    // Calculate the width and height of each palette block
    // based upon the size of the input image and the number
    // of blocks.
    $block_w = round($width / $palette_w);
    $block_h = round($height / $palette_h);

    for($y = 0; $y < $palette_h; $y++) {
        for($x = 0; $x < $palette_w; $x++) {
            // Calculate where to take an image sample from the soruce image.
            $block_start_x = ($x * $block_w);
            $block_start_y = ($y * $block_h);

            // Create a blank 1x1 image into which we will copy
            // the image sample.
            $block = imagecreatetruecolor(1, 1);

            imagecopyresampled($block, $img_resource, 0, 0, $block_start_x, $block_start_y, 1, 1, $block_w, $block_h);

            // Convert the block to a palette image of just one colour.
            imagetruecolortopalette($block, true, 1);


            // Find the RGB value of the block colour and save it
            // to an array.
            $colour_index = imagecolorat($block, 0, 0);
            $rgb = imagecolorsforindex($block, $colour_index);

            $colour_array[$x][$y]['r'] = $rgb['red'];
            $colour_array[$x][$y]['g'] = $rgb['green'];
            $colour_array[$x][$y]['b'] = $rgb['blue'];

            imagedestroy($block);
        }
    }

    imagedestroy($img_resource);
    return $colour_array;
}

Answer 2

it can help you

<?php
$im = ImageCreateFromJpeg($source_file);

$imgw = imagesx($im);
$imgh = imagesy($im);

// n = total number or pixels

$n = $imgw*$imgh;

$colors = array();

for ($i=0; $i<$imgw; $i++)
{
        for ($j=0; $j<$imgh; $j++)
        {

                $rgb = ImageColorAt($im, $i, $j);

                if (isset($colors[$rgb])) {
                    $colors[$rgb]++;
                }
                else {
                    $colors[$rgb] = 1;
                }

        }
}
asort($colors);
print_r($colors);

Answer 3

The imagecolorat function will give you the color value in a pixel, which you can use to scan the image and create a color histogram:

http://www.php.net/manual/en/function.imagecolorat.php