nachopro yendo de la cama a la compu…

7May/073

Recorte y redimensión de imágenes en PHP

Sea cuál sea la finalidad de un sitio web siempre va a llevar una sección de noticias, novedades o algo por el estilo que nos de ganas de agregarle una bonita foto que amplíe su contenido.

Hoy si bien muchas personas, entre las que me incluyo, utilizan CMSs, muchas otras, en las que también me incluyo, programan letra a letra el código PHP de su sitio web. Para estos últimos está orientado este coqueto código.

Partamos de la base que tenemos un Sitio web, grande o pequeño no importa, y éste tiene un listado de noticias, cada cual tiene su correspondiente foto y un ABM para administrar su contenido.

¿Qué problema se nos presenta con el tema de las fotos? Sí, ese mismo. Las fotos que subamos y asignemos a cada noticia no van a ser del mismo tamaño ni respetar una proporción en cuanto a su ancho y alto a no ser que nos tomemos el tiempo de editar una por una antes, cosa que no queremos en este caso :P

Así que, luego de tran larga introducción, les brindo el siguiente código (de mi autoría) que toma una imagen (GIF, PNG o JPG) la analiza y devuleve una nueva del tamaño que le especifiquemos sin deformarla.

?php
list($org_ancho, $org_alto, $formato) = getimagesize($_GET['ruta']); //obtenemos los datos de la imagen.

switch ($formato) //en base a su formato la cargamos.
{
	case 1:
		$original = imagecreatefromgif($_GET['ruta']);
		break;
	case 2:
		$original = imagecreatefromjpeg($_GET['ruta']);
		break;
	case 3:
		$original = imagecreatefrompng($_GET['ruta']);
		break;
}

if ($org_ancho > $org_alto) //si el ancho es mayor al alto, es del tipo apaisada.
{
	$nue_ancho = $_GET['ancho'];
	$nue_alto = $_GET['alto'];
	$ratio = $org_alto / $nue_alto;
	$tmp_ancho = round($nue_ancho * $ratio);
	$dif_ancho = round(($org_ancho / 2) - ($tmp_ancho / 2));

	$nueva = imagecreatetruecolor($nue_ancho, $nue_alto);
	imagecopyresampled($nueva, $original, 0, 0, $dif_ancho, 0, $nue_ancho, $nue_alto, $tmp_ancho, $org_alto);
}
else //si el ancho es menor o igual al alto, es del tipo retrato o cuadrada
{
	$nue_ancho = $_GET['ancho'];
	$nue_alto = $_GET['alto'];
	$ratio = $org_ancho / $nue_ancho;
	$tmp_alto = round($nue_alto * $ratio);
	$dif_alto = round(($org_alto / 2) - ($tmp_alto / 2));

	$nueva = imagecreatetruecolor($nue_ancho, $nue_alto);
	imagecopyresampled($nueva, $original, 0, 0, 0, $dif_alto, $nue_ancho, $nue_alto, $org_ancho, $tmp_alto);
}

imageinterlace($nueva, 1); //hacemos que la imagen sea progresiva

header('Content-type: image/jpeg'); //especificamos que va a ser una imagen jpg
imagejpeg($nueva); //sacamos a pantalla la imagen
?

Ahora bien, el código debe ser guardado en un archivo, en mi caso miniatura.php, y haremos referencia a él desde el tag img de HTML y le pasaremos los parámetros con los que opera:

ruta: dirección relativa o absoluta a la imagen a procesar.
ancho y alto: en pixels, ingresamos las dimensiones de salida que queremos que tenga la nueva imagen.

Ej.: foto

Esto devolverá una foto miniatura de perro.jpg de 100x75 px.

Ahora les dejo el resultado de unas imágenes tratadas con este código.

Imagen original: 1024x768; relación 4:3; apaisada.
ovejas_320×240.jpg
Resultante 1: 320x240; relación 4:3; apaisada.

ovejas_240×320.jpg
Resultante 2: 240x320; relación 3:4; retrato.

Imagen original: 1024x768; relación 3:4; retrato.
gallina_320×240.jpg
Resultante 1: 320x240; relación 4:3; apaisada;

gallina_240×320.jpg
Resultante 2: 240x320; relación 3:4; retrato.

En el caso de que la relación de la foto no de con la que deseemos como salida dadas las dimenciones ocurrirá lo mismo que en la siguiente foto. El código siempre preservará la legibilidad de la imagen ante todo ;)

perro_exceso.jpg

Filed under: Uncategorized Leave a comment
Comments (3) Trackbacks (0)
  1. eh, la verdad es que es mucha informacion y util la voy a aplicar cuando entienda al menos dos palabras.

    jaja, besos amor.

  2. muy bueno el post justo lo que buscaba para un sistema de noticias….pero creo que encontre un error no tiene que ir (osea faltan los )? jejejejeje :D pero bueno = ya se los agregue muy bueno nos vemos suerte


Leave a comment


*
Before you submit form:
Human test by Not Captcha

No trackbacks yet.

Pages

Categories

Blogroll

Archive

Meta