Problema con paleta de colores PHP

[neodani]

Buenas,

Estoy tratando de extraer el color de los pixels de una imagen y me está volviendo loco.

La parte de recorrer los pixels de la imagen y tal la tengo clara, mi problema radica en que despues de varias pruebas los colores que me pilla el script no son los colores reales, sino que los transforma y me saca el color más próximo a los Web Safe Colors, que son 216 exactamente.

Ejemplo:
http://www.techbomb.com/websafe/
http://es.html.net/tutorials/html/le...olourchart.php

La parte de identificar el color la hago de la siguiente manera

Código PHP:

$thisColor = imagecolorat($img, $x, $y); 
 
$rgb = imagecolorsforindex($img, $thisColor); 
            
$red = round(round(($rgb['red'] / 0x33)) * 0x33); 
$green = round(round(($rgb['green'] / 0x33)) * 0x33); 
$blue = round(round(($rgb['blue'] / 0x33)) * 0x33); 
$thisRGB = sprintf('%02X%02X%02X', $red, $green, $blue);
 

Pero no sé si es la función imagecolorat o imagecolorsforindex la que "distorsiona" el color verdadero y me muestra uno de los Web Safe Colors.

Sabéis como puedo mostrar el color verdadero del pixel? tengo que hacer algo antes o aplicar otro comando?

Muchas gracias de antemano

[marlanga]

Lo que creo que hace lo que dices es tu doble redondeo a 0x33.

[neodani]

Ostras, es verdad.

Si le quito el doble redondeo, me muestra el valor del pixel real. Ahora lo que pasa es que hay imagenes que igual varía unos números el color pero sigue siendo el mismo color. No existe ninguna función que haga como un poco de tolerancia y que por ejemplo estos colores los simplique?



Hay 7 pixeles de color diferente, pero en verdad son solo 3 colores diferentes
El negro el verde claro y el verde oscuro

#2B2B2B
#50AEC0
#82E0F2

Sabéis a lo que me refiero, verdad?

Muchas gracias de antemano

[marlanga]

Sí, a crear tu propio algoritmo de compresión de imágenes con paleta dinámica.

Por ejemplo:

Código PHP:

<?php
header( "Content-type: image/png" );
$imageName="cat.jpg";
$size  = getimagesize($imageName);
$img = imagecreatefromjpeg($imageName);
 
for ($x=0;$x<$size[0];$x++)
{
    for ($y=0;$y<$size[1];$y++)
    {
        $pixel = imagecolorat($img, $x, $y);
        $pixelColor = imagecolorsforindex($img, $pixel);
 
        $rango=51;
        $r=(int)floor($pixelColor["red"]/$rango)*$rango;
        $g=(int)floor($pixelColor["green"]/$rango)*$rango;
        $b=(int)floor($pixelColor["blue"]/$rango)*$rango;
 
        $index=imagecolorexact($img,$r,$g,$b);
        imagesetpixel($img, $x, $y, $index);
    }
}
 
imagepng($img);
imagedestroy($img);
 
?>
 

He creado una paleta de 216 colores (51 es divisor de 255, aunque en realidad puedes poner cualquier cifra entre 0 y 255; si no son divisores, habrá un insignificante e indetectable error en el redondeo de colores cercanos al blanco absolto), cada componente de color puede coger valores de 0, 51, 102, 153, 205 y 255. Seis colores. Tres componentes=6*6*6=216.

El límite es tu imaginación. Puedes crear tú en un array la paleta, y hacer una función que escoja el color aproximado (por ejemplo sumando la diferencia de cada componente del pixel de la imagen con el componente de cada color de la paleta, y quedarse el menor).

[neodani]

Gracias de nuevo marlanga, lo que indicas suena muy bien pero no veo la forma de hacerlo

En el ejemplo anterior, me salian 7 colores diferentes en la imagen, cuando en verdad solo necesitaba 3 colores.

La imagen de pruebas es la siguiente, (no tengas en cuenta el fondo blanco, que para subirla online necesitaba que fuese de 150x150, cuenta que la imagen son las 6 redonditas con el fondo negro :D)



Si mi paleta fuese los 3 colores siguientes:

#2B2B2B
#50AEC0
#82E0F2

Me interesa saber el número de pixeles que hay de cada color, considerando que los que no sean esos colores, me los cuente como si lo fueran (acercandose a color más próximo de mi paleta y contandolos como tal).

Para sacar los colores de mi imagen de ejemplo, sigo un patron y cojo los pixels de las siguientes posiciones:

Posicion X: 13 | Y: 7
Red: 129 | Green: 222 | Blue: 239
Posicion X: 13 | Y: 13
Red: 43 | Green: 43 | Blue: 43
Posicion X: 25 | Y: 7
Red: 75 | Green: 160 | Blue: 174
Posicion X: 25 | Y: 13
Red: 43 | Green: 43 | Blue: 43
Posicion X: 37 | Y: 7
Red: 71 | Green: 149 | Blue: 162
Posicion X: 37 | Y: 13
Red: 43 | Green: 43 | Blue: 43
Posicion X: 49 | Y: 7
Red: 73 | Green: 160 | Blue: 174
Posicion X: 49 | Y: 13
Red: 43 | Green: 43 | Blue: 43
Posicion X: 61 | Y: 7
Red: 80 | Green: 174 | Blue: 192
Posicion X: 61 | Y: 13
Red: 43 | Green: 43 | Blue: 43
Posicion X: 73 | Y: 7
Red: 78 | Green: 176 | Blue: 193
Posicion X: 73 | Y: 13
Red: 43 | Green: 43 | Blue: 43

En total me saca 7 colores, pero el resultado que busco es, sin contar el fondo negro, imagina que solo cojes el pixel central de cada redonda (en eso no tengo dificultades), y te salen los 6 colores de verde diferente, pero en verdad solo necesitas 2 colores de verde, los dos de mi paleta.

Me debería decir que ha encontrado
2 bolas #82E0F2
4 bolas #50AEC0

Mi código

Código PHP:

function colorPalette($imageFile, $numColors, $granularity = 12) {
    $granularity = max(1, abs((int)$granularity)); 
    $colors = array(); 
    $size = @getimagesize($imageFile); 
 
    if( $size === false ){ 
        user_error("Unable to get image size data"); 
        return false; 
    }
 
    $img = @imagecreatefromstring(file_get_contents($imageFile));
 
    if( !$img ){ 
        user_error("Unable to open image file"); 
        return false; 
    } 
 
    echo "<br/>size0: ".$size[0].'<br/>';
    echo "size1: ".$size[1].'<br/>';
 
    for($x = 13; $x < $size[0]; $x += $granularity){ // Horizontal  
 
        for($y = 7; $y < $size[1]; $y += $granularity/2){ // Vertical 
        
            echo "Posicion X: $x | Y: $y<br/>";
            $thisColor = imagecolorat($img, $x, $y); 
            $rgb = imagecolorsforindex($img, $thisColor);
                
            $red = $rgb['red']; 
            $green = $rgb['green']; 
            $blue = $rgb['blue'];
            
            $result = imagecolorclosest($img, $red, $green, $blue);
            $result = imagecolorsforindex($img, $result);
            $result = "({$result['red']}, {$result['green']}, {$result['blue']})";
            
            $thisRGB = sprintf('%02X%02X%02X', $red, $green, $blue);
            echo "Red: $red | Green: $green | Blue: $blue<br/>";
            if(array_key_exists($thisRGB, $colors)){ 
                $colors[$thisRGB]++; 
            }else{ 
                $colors[$thisRGB] = 1; 
            } 
        }
    } 
    arsort($colors); 
    return array_slice(array_keys($colors), 0, $numColors); 
} 
 
/* PRINCIPAL */
 
$archivo = 'espada3.png';
 
echo '<img src="'.$archivo.'"/>';
 
$palette = colorPalette($archivo,32, 12);
 
echo "<table>\n"; 
foreach($palette as $color){ 
   echo "<tr><td style='background-color:#$color;width:2em;'>&nbsp;</td><td>#$color</td></tr>\n"; 
} 
echo "</table>\n";
 

Muchas gracias de antemano!!!!

[neodani]

Os dejo el código actualizado.

Tengo definida una paleta de verdes y cuando analizo la siguiente imagen de cuadrados soy capaz de contar cuantos cuadrados hay de cada color.

Hasta aquí bien.

Pero quiero dar uso a mi paleta de verdes.
Me gustaría ser capaz de saber a qué verde se acerca más, el verde de la imagen de cuadrados.

No encuentro una forma de seleccionar el verde de mi paleta de colores que se acerca más al verde encontrado en la imagen.

Código PHP:

<?php
 
function HexToRGB($hex) { $hex = str_replace("#", "", $hex); $color = array(); if(strlen($hex)==3) { $color['r'] = hexdec(substr($hex, 0, 1).substr($hex, 0, 1)); $color['g'] = hexdec(substr($hex, 1, 1).substr($hex, 1, 1)); $color['b'] = hexdec(substr($hex, 2, 1).substr($hex, 2, 1)); }elseif(strlen($hex)==6){ $color['r'] = hexdec(substr($hex, 0, 2)); $color['g'] = hexdec(substr($hex, 2, 2)); $color['b'] = hexdec(substr($hex, 4, 2)); } return $color; } 
 
// Mi paleta verde
$paleta_verde=array('0F8A49','5CCF97','87DDAD','79E633','57BE00','BCF25E');
 
$imageName="cuadrados2.png";
$size  = getimagesize($imageName);
$img = imagecreatefrompng($imageName);
$colors = array();
$granularity = 12; // Defino el tamaño del Pixel
 
//Imprimo mi Paleta de Verdes
echo "<p>Mi Paleta</p>";
echo "<table>\n"; 
foreach($paleta_verde as $color){
    $rgb = HexToRGB($color);
    echo "<tr><td style='background-color:#$color;width:2em;'>&nbsp;</td><td>#$color</td><td>| RGB (".$rgb['r'].' , '.$rgb['g'].' , '.$rgb['b'].')'."</td></tr>"; 
} 
echo "</table>\n";
 
// Imprimo la imagen
echo '<br/><img src="'.$imageName.'"/><br/>';
 echo "Size: ".$size[0].' x '.$size[1].'<br/><br/>';
// Recorro la imagen
 
for ($x=12;$x<$size[0];$x += $granularity)
{
    for ($y=12;$y<$size[1];$y += $granularity)
    {
        $pixel = imagecolorat($img, $x, $y);
        $pixelColor = imagecolorsforindex($img, $pixel);
 
        $rango=1;
        $r=(int)floor($pixelColor["red"]/$rango)*$rango;
        $g=(int)floor($pixelColor["green"]/$rango)*$rango;
        $b=(int)floor($pixelColor["blue"]/$rango)*$rango;
        
        $index=imagecolorexact($img,$r,$g,$b);
        
        $thisRGB = sprintf('%02X%02X%02X', $r, $g, $b);
        echo "Red: $r | Green: $g | Blue: $b | Posicion X: $x | Y: $y<br/>";
 
        if(array_key_exists($thisRGB, $colors)){ 
            $colors[$thisRGB]++; 
        }else{ 
            $colors[$thisRGB] = 1; 
        } 
    }
}
 
// RESUMEN
 
echo "<br/>Colores encontrados<br/>";
arsort($colors); // Ordeno los colores obtenidos de mayor a menor.
 
//Imprimo los colores encontrados
echo "<table>\n"; 
foreach($colors as $color=>$numero){
    $rgb = HexToRGB($color);
    echo "<tr><td>$numero</td><td style='background-color:#$color;width:2em;'>&nbsp;</td><td>#$color</td><td>| RGB (".$rgb['r'].' , '.$rgb['g'].' , '.$rgb['b'].')'."</td></tr>"; 
} 
echo "</table>\n";
 
?>
 

Una ayuda??

Muchas gracias de antemano!

[marlanga]

Ya te puse cómo obtener la distancia entre dos colores para elegir el más próximo. No se casi nada de la teoría de color, así que es probable que exista otra fórmula de proximidad que de mejores resultados.

Código PHP:

<?php
header( "Content-type: image/png" );
$imageName="cat2 - copia.jpg";
$size  = getimagesize($imageName);
$img = imagecreatefromjpeg($imageName);
 
$paleta=array(
    array(15, 138, 73),
    array(92, 207, 151),
    array(135, 221, 173),
    array(121, 230, 51),
    array(87, 190, 0),
    array(188, 242, 94)
);
 
function colorCercano($color, $paleta){
    $n=count($paleta);
    $distancia=INF;
    $mejor=0;
    for ($i=0;$i<$n;$i++)
    {
        $actual=abs($color[0]-$paleta[$i][0])+abs($color[1]-$paleta[$i][1])+abs($color[2]-$paleta[$i][2]);
        //$actual=sqrt(pow($color[0]-$paleta[$i][0],2)+pow($color[1]-$paleta[$i][1],2)+pow($color[2]-$paleta[$i][2],2));
        if ($distancia>$actual)
        {
            $distancia=$actual;
            $mejor=$i;
        }
    }
    return $paleta[$mejor];
}
 
for ($x=0;$x<$size[0];$x++)
{
    for ($y=0;$y<$size[1];$y++)
    {
        $pixel = imagecolorat($img, $x, $y);
        $pixelColor = imagecolorsforindex($img, $pixel);
 
        $colorFinal=colorCercano(array($pixelColor["red"],$pixelColor["green"],$pixelColor["blue"]),$paleta);
 
        $index=imagecolorexact($img,$colorFinal[0],$colorFinal[1],$colorFinal[2]);
        imagesetpixel($img, $x, $y, $index);
    }
}
 
imagepng($img);
imagedestroy($img);
 

[neodani]

Muchas gracias marlanga,

Gracias, me ha sido de gran utilidad tu ejemplo.