Código de PHP - Obtener el promedio del color de una imagen

Imágen de perfil
Val: 3.040
Oro
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

Obtener el promedio del color de una imagengráfica de visualizaciones


PHP

estrellaestrellaestrellaestrellaestrella(5)
Publicado el 15 de Agosto del 2017 por xve
2.109 visualizaciones desde el 15 de Agosto del 2017
Este código muestra como recorrer una imagen pixel a pixel para obtener el promedio del color de la imagen.

promedioColor

Versión 1
estrellaestrellaestrellaestrellaestrella(5)

Actualizado el 4 de Octubre del 2017 (Publicado el 15 de Agosto del 2017)gráfica de visualizaciones de la versión: Versión 1
2.110 visualizaciones desde el 15 de Agosto del 2017
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<?php
/**
 * Función que tiene que recibir la ruta de una imagen de nuestro servidor web
 * y devuelve un array con los colores mas utilizados para el rojo, verde y azul
 * Si no devuelve una imagen conocida, devuelve array(0,0,0)
 */
function promedioColorImagen($rutaImagen)
{
	// obtenemos el tipo mime de la imagen (desde PHP 5.3)
	$finfo=finfo_open(FILEINFO_MIME_TYPE);
	$fileMime=finfo_file($finfo, $rutaImagen);
 
	// abrimos la imagen
	if($fileMime=="image/jpeg" || $fileMime=="image/pjpeg")
		$imgId=imagecreatefromjpeg($rutaImagen);
	elseif($fileMime=="image/gif")
		$imgId=imagecreatefromgif($rutaImagen);
	elseif($fileMime=="image/png")
		$imgId=imagecreatefrompng($rutaImagen);
	else
		return array(0,0,0);
 
	$red=0;
	$green=0;
	$blue=0;
	$total=0;
 
	// Recorremos todos los valores horizontales
	for ($x=0;$x<imagesx($imgId);$x++)
	{
		// Recorremos todos los valores verticales
		for ($y=0;$y<imagesy($imgId);$y++)
		{
			// Obtenemos los valores red, green, blue de cada pixel de la imagen
			// (http://php.net/manual/en/function.imagecolorat.php)
			$rgb=imagecolorat($imgId,$x,$y);
 
			// devuelve el indice de cada color
			$red+=($rgb >> 16) & 0xFF;
			$green+=($rgb >> 8) & 0xFF;
			$blue+=$rgb & 0xFF;
 
			$total++;
		}
	}
	$redPromedio = round($red/$total);
	$greenPromedio = round($green/$total);
	$bluePromedio = round($blue/$total);
 
	// devolvemos un array con el promedio de los colores en rojo, verde y azul
	return array($redPromedio,$greenPromedio,$bluePromedio);
}
 
/**
 * Funcion para mostrar una imagen en nuestra pagina web. Tiene que recibir
 * la ruta de una imagen de nuestro servidor web y un array con los tres colores
 * rojo, verde y azul
 */
function mostrarImagen($imagen,$colores)
{
	list($red,$green,$blue)=$colores;
	echo "<div class='image'>";
	echo "<img src='".$imagen."'>";
	echo "<div style='background-color:rgb(".$red.",".$green.",".$blue.")'><span>Este es el promedio de los colores de la imagen</span></div>";
	echo "</div>";
}
 
$imagen="paisaje1.jpg";
mostrarImagen($imagen,promedioColorImagen($imagen));
$imagen="paisaje2.jpg";
mostrarImagen($imagen,promedioColorImagen($imagen));
 
?>
 
<style>
.image {clear:both;display:inline-block;}
.image>img {max-height:400px;}
.image>div {height:100px;}
.image>div>span {display:block;padding:10px;text-shadow: 1px 1px #fff;}
</style>



Comentarios sobre la versión: Versión 1 (5)

Imágen de perfil
15 de Agosto del 2017
estrellaestrellaestrellaestrellaestrella
Excelente!. Puede ser muy útil.

Gracias
Responder
Imágen de perfil
15 de Agosto del 2017
estrellaestrellaestrellaestrellaestrella
Te me adelantaste en este tema !!! Ya posteare mi codigo tambien Xve jajaja Excelente.
Responder
ale
23 de Agosto del 2017
estrellaestrellaestrellaestrellaestrella
Se podria mejorar haciendolo mas dinamico, es decir con un drag picker para introducir una imagen desde el pc o navegador
Responder
Imágen de perfil
6 de Septiembre del 2017
estrellaestrellaestrellaestrellaestrella
Es parecido a lo que hace w10 con su tema segun la imagen?

lo puedes hacer para javascript?
Responder
Imágen de perfil
4 de Octubre del 2017
estrellaestrellaestrellaestrellaestrella
Excelente!
Responder

Comentar la versión: Versión 1

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios
Es necesario revisar y aceptar las políticas de privacidad

http://lwp-l.com/s4116