2009-11-17 13 views
9

Quiero mostrar imágenes en divs o tablas como fondos. Si las imágenes no son lo suficientemente grandes, voy a necesitar encontrar el color más externo de esa imagen y aplicarlo al fondo de la celda div o tabla que lo contiene.Obtener color de imagen

¿Alguien tiene experiencia con esto? En PHP. Soy un novato así que por favor explique. Muchas gracias

+0

¿Alguna vez funciona esto? –

Respuesta

23

Echa un vistazo a GD functions.

Aquí hay una solución de looping through the pixels para encontrar el color más común. Sin embargo, you could just resize the image to 1 pixel - ese debería ser el color promedio - ¿no?

Un ejemplo del método 1px (que ahora incluye la página de prueba):

<?php 
    $filename = $_GET['filename'];  
    $image = imagecreatefromjpeg($filename); 
    $width = imagesx($image); 
    $height = imagesy($image); 
    $pixel = imagecreatetruecolor(1, 1); 
    imagecopyresampled($pixel, $image, 0, 0, 0, 0, 1, 1, $width, $height); 
    $rgb = imagecolorat($pixel, 0, 0); 
    $color = imagecolorsforindex($pixel, $rgb); 
?> 
<html> 
    <head> 
    <title>Test Image Average Color</title> 
    </head> 
    <body style='background-color: rgb(<?php echo $color['red'] ?>, <?php echo $color['green'] ?>, <?php echo $color['blue'] ?>)'> 
    <form action='' method='get'> 
     <input type='text' name='filename'><input type='submit'> 
    </form> 
    <img src='<?php echo $filename ?>'> 
    </body> 
</html> 

Aquí hay un código de ejemplo para encontrar la media frontera color, similar a la del primer enlace. Para su uso esto puede funcionar mejor (Sé que este código es ineficiente, pero esperamos que sea fácil de seguir):

<?php 
    $filename = $_GET['filename'];  
    $image = imagecreatefromjpeg($filename); 
    $width = imagesx($image); 
    $height = imagesy($image); 

    for($y = 0; $y < $height; $y++){ 
    $rgb = imagecolorat($image, 0, $y); 
    $color = imagecolorsforindex($image, $rgb); 
    $red += $color['red']; 
    $green += $color['green']; 
    $blue += $color['blue']; 

    $rgb = imagecolorat($image, $width -1, $y); 
    $color = imagecolorsforindex($image, $rgb); 
    $red += $color['red']; 
    $green += $color['green']; 
    $blue += $color['blue']; 
    } 

    for($x = 0; $x < $height; $x++){ 
    $rgb = imagecolorat($image, $x, 0); 
    $color = imagecolorsforindex($image, $rgb); 
    $red += $color['red']; 
    $green += $color['green']; 
    $blue += $color['blue']; 

    $rgb = imagecolorat($image, $x, $height -1); 
    $color = imagecolorsforindex($image, $rgb); 
    $red += $color['red']; 
    $green += $color['green']; 
    $blue += $color['blue']; 
    } 

    $borderSize = ($height=$width)*2; 
    $color['red'] = intval($red/$borderSize); 
    $color['green'] = intval($green/$borderSize); 
    $color['blue'] = intval($blue/$borderSize); 

?> 

actualización: Puse un poco more refined code on github. Esto incluye promediar el borde y promediar la imagen completa. Cabe señalar que cambiar el tamaño a 1px es mucho más fácil de usar que escanear cada píxel (aunque no he realizado ninguna prueba en tiempo real), pero el código muestra los tres métodos diferentes.

+0

Realicé algunas pruebas del código de cambio de tamaño y parece que funciona. –

+0

Lo siento pero soy un principiante, ¿cómo podría aplicar eso a un div para el color de fondo? Alguna idea, Tim Gracias por sugerir esto también, significa mucho. –

+0

Oh déjame ver si puedo hacer que esto funcione, GRACIAS TIM –

Cuestiones relacionadas