Ver índice
Encuadre y redimensionado de imágenes

        Ocultar índice  

   Índice de contenidos
   Instalación en Windows
   Instalación en Ubuntu
   Servidores seguros
   Páginas dinámicas
   Sintaxis básica
   Operaciones
   Arrays
   Formatos de presentación
   Operadores
   Bucles
   Extraer y ord. información
   Funciones
   Ficheros externos
   Imágenes dinámicas
   Gestión de directorios
   Cookies y sesiones
   Clases y objetos
   Ficheros en formato PDF
   Bases de datos MySQL
   PHP y XML
   PDO - Bases SQLite / MySQL
   MySQL a traves de misqli
   Algo de JavaScript y AJAX


Lectura de imágenes externas

La visualización de imágenes no presenta ningún problema –lo hacemos habitualmente mediante etiquetas HTML– cuando se encuentran en el espacio del servidor, bien sea propio o ajeno. El problema puede surgir cuando tratemos de almacenar esas imágenes fuera del root del servidor (una forma de impedir la accesibilidad desde otras webs) y eso puede conseguirse mediante las funciones que veremos en este capítulo.

Se trata de utilizar PHP para hacer una copia de la imagen original. Para ello debemos conocer la ubicación de aquella y también su fomato. A partir de esos datos ya solo nos quedaría utilizar una de las funciones:

$copia=imagecreatefromjpeg($original)
o
$copia=imagecreatefrompng($original)
o
$copia=imagecreatefromgif($original)

que nos permitiría crear una copia de la imagen original utilizando la función adecuada al formato de aquella (jpg, png o gif). La visualización de la imagen requiere los mismos elementos de ejemplos anteriores:

En estos ejemplos puedes ver los resultados de la copia de los tres tipos de imagen.

<?php
/* ruta completa hasta la imagen original. Aunque aqui usamos DOCUMENT_ROOT para establecer
 la ruta hasta la imagen ejemplo no sería preciso que estuviera en el root del servidor.
  Podría estar en cualquier directorio fuera de ese ámbito */
$original=$_SERVER['DOCUMENT_ROOT']."/php/images/caballos.jpg"; 
 /* para conocer el formato de la imagen podemos extraer
    el nombre de la extensión de la imagen original
    que será lo que hay a partir del último "punto" de la
    cadena que contiene la ruta completa */

for($i=strlen($original)-1;$i>0;$i--){
    if (substr($original,$i,1)=="."){
            $tipo=substr($original,$i+1);
            break;
    }
} 

/* insertamos el Header correspondiente al cualquiera de los tipos de imagen
   utilizables por PHP. Por ejemplo: jpeg */
   Header("Content-type:image/jpeg");
/* el uso de switch puede sernos útil para elegir la función adecuada */
switch($tipo){
    case "jpg":
          $copia=imagecreatefromjpeg($original);
    break;
    case "png":
          $copia=imagecreatefrompng($original);

    break;
    case "gif":
          $copia=imagecreatefromgif($original);
    break;
 }
 /* visualizamos la imagen ateniendonos al formato establecido en Header */
   imagejpeg($copia);
   /* eliminamos la imagen de memoria  */
ImageDestroy($copia);
?>
Ver ejemplo .jpg Ver ejemplo .png Ver ejemplo .gif

Redimensionar y recortar de imágenes externas

Puede parecer que esta posibilidad carece de utilidad. A fin de cuentas, con etiquetas HTML podemos asignar el ancho y el alto de una imagen. Pero enseguida veremos que esta opción no es tan trivial como parece. El objetivo es obtener una imagen con unas dimensiones determinadas y unos márgenes también establecidos a partir de una parte (o el todo) de un original.

Copia de la imagen original. Pretendemos recortar la parte marcadaLa imagen resultante tiene bordes en blanco y además contiene el recorte de la anterior ampliado y deformado

Lo que necesitamos es crear una imagen «en blanco» con las dimensiones elegidas y posteriormente incrustar en ella la copia de una imagen externa después de haberla deformado para adaptarla a unas nuevas dimensiones. Para lograr este propósito va a ser necesario que utilicemos estas funciones:

$dimensiones=getimagesize($original)

dónde $original es la variable que contiene el path y nombre del fichero externo que contiene la imagen y $dimensiones es un array escalar que contiene las dimensiones de la imagen analizada. El elemento del array $dimensiones[0] contiene el ancho y $dimensiones[1] el alto, ambos expresados en pixels.

$ampliacion=imagecreatetruecolor(x, y)

dónde $ampliacion es el identificador de una nueva imagen –en blanco– creada en color verdadero con dimensiones x e y

imagecopyresampled($ampliacion, $copia, Xampliacion, Yampliacion, Xcopia, Ycopia, Ax , Ay, Ox , Oy)

$ampliacion que es el identificador de la imagen destino, es decir la imagen en blanco sobre la que pretendemos insertar todo o parte de la original, $copia es el identificador de una copia de la imagen original previamente guardada en memoria, Xampliacion e Yampliacion son las coordenadas de un punto situado en la esquina superior izquierda del papel a partir del que queremos que se impresione la fotografía. Si queremos una foto a sangre pondremos 0,0 y, si quieres dejar márgenes en blanco, habrá que poner los anchos de esos márgenes (izquierdo y superior) respectivamente. Xcopia e Ycopia nos servirán para reencuadrar la foto original recortando por la izquierda y por arriba, respectivamente, los anchos que se indiquen aquí en pixels. Si no queremos recortar la imagen original ni por la izquierda ni por la derecha pondremos 0,0.

Ax y Ay indican el ancho y el alto (por este orden) que va a tener la mancha de imagen en la imagen resultante. Ten en cuenta que no podemos salirnos del papel así que esos valores sumados con los márgenes (izquierdo y superior) no podrán ser mayores que las dimensiones de la imagen ampliada.

Ox y Oy indican el ancho y el alto de la porción del original que tratamos de reproducir. Sumados con Xcopia e Ycopia no pueden exceder el tamaño de la imagen original.

Con estos parámetros la función ya se encarga de redimensionar la imagen (incluso distorsionarla, si no hay proporcionalidad entre los anchos y altos del original y del soporte. El proceso es el siguiente:

  ¡Cuidado!  

Observa que las imágenes en formato png se visualizan con deficiencias en los bordes de las áreas transparentes.

Con el método que vemos a continuación ese problema se reduce considerablemente.


Lectura y redimensionado de imágenes externas

<?php
/* indicamos la ruta de la imagen original */
$original=$_SERVER['DOCUMENT_ROOT']."/php/images/caballos.jpg"; 
/* determinamos el formato de esa imagen */
for($i=strlen($original)-1;$i>0;$i--){
    if (substr($original,$i,1)=="."){
       $tipo=substr($original,$i+1);
       break;
    }
}
/* determinamos las dimesiones de la imagen  original */
$tamano=getimagesize($original);
$orig_Ancho = $tamano[0];
$orig_Alto =$tamano[1]; 
/* vamos a tratar de obtener una imagen deformada para ello usaremos factores de ampliación
 distintos para para cada uno de los lados. Multiplicaremos por 2 el ancho y por 1.5 el alto */
$ampliacion_X=2;
$ampliacion_Y=1.5;
/* Pretendemos que la imagen resultante no tenga márgenes en blanco por tanto sus dimensiones
van a ser las del original multiplicado por los factores de ampliacion */
$resultado_Ancho=$orig_Ancho*$ampliacion_X;
$resultado_Alto= $orig_Alto*$ampliacion_Y;
/* creamos una copia de la imagen original. Debemos elegir la funcion adecuada al tipo de aquella*/
switch($tipo){
    case "jpg":
	   $copia=imagecreatefromjpeg($original);
	 break;
	case "png":
	   $copia=imagecreatefrompng($original);
	 break;
	 case "gif":
	   $copia=imagecreatefromgif($original);
	 break;
}
/* insertamos la cabecera de nuestra imagen final ampliada */
Header("Content-type:image/jpeg");
      /* creamos una imagen nueva en color verdadero*/
       $ampliada=imagecreatetruecolor($resultado_Ancho,$resultado_Alto);
    /* aplicamos un color de fondo a la nueva imagen para poder visualizar que incluye
    la transparencia del png y/o del gif  */
	   if($tipo=="png" OR $tipo=="gif"){
		   $fondo=imagecolorAllocate($ampliada,255,255,200);
		   imagefill($ampliada,0,0,$fondo);
	   }
/* incrustamos la imagen importada sobre la que acabamos de crear teniendo en cuenta
   los parámetros de la función. Los cuatro ceros se deben a que vamos a colocar toda
   la imagen original (sin recortes) sin dejar ningun margen en blanco) y
   los anchos y altos se mantienen dado que ni recortamos nada la imagen original
   ni vamos a dejar margen alguno en la resultante */
       imagecopyresampled($ampliada,$copia,0,0,0,0,
                                $resultado_Ancho, $resultado_Alto,
                                $orig_Ancho,$orig_Alto);
		/* visualizamos la imagen resultante */
          imagejpeg($ampliada);
ImageDestroy();
?>
Ver ejemplo .jpg Ver ejemplo .png Ver ejemplo .gif

Observa que –tanto en el ejemplo anterior como en el siguiente– solo hemos utilizado la extensión de la imagen original para elegir la función imagecreatefrom.... En el Header hemos puesto image/jpeg y, como es obvio, hemos utilizado la función asociada a este formato (imagejpeg). Si sustituimos ambos valores por los correspondientes a otro formato (gif, png) obtendríamos resultados similares.


Recortar y encuadrar imágenes externas

<?php
/* indicamos la ruta de la imagen original */
$original=$_SERVER['DOCUMENT_ROOT']."/php/images/aviones4.jpg";
/* determinamos el formato de esa imagen */
for($i=strlen($original)-1;$i>0;$i--){
    if (substr($original,$i,1)=="."){
       $tipo=substr($original,$i+1);
       break;
    }
}
/* determinamos el tamaño de la imagen original */
$tamano=getimagesize($original);
$orig_Ancho = $tamano[0];
$orig_Alto =$tamano[1];
/* asignamos a una variable el margen en blanco de la imagen igual por los cuatro lados */
$margen=15;
/* establecemos los recortes para reencuadrar la imagen original */
$recorte_izq=50; $recorte_sup=80; $recorte_der=40; $recorte_inf=60;
/* calculamos las dimensiones para utilizar como parámetros en la funcion
 imagecopyresampled
  ancho y alto de la imagen original después del recorte de encuadre */
$Ancho_recortado=$orig_Ancho-$recorte_izq-$recorte_der;
$Alto_recortado=$orig_Alto-$recorte_sup-$recorte_inf;
/* establecemos factores de ampliación iguales para evitar distorsiones */
$ampliacion_X=1.3; $ampliacion_Y=1.3; 
/* determinamos las dimensiones de la imagen final teniendo en cuenta los
margenes y los factores de ampliación */
$papel_Ancho=$Ancho_recortado*$ampliacion_X+ 2*$margen;
$papel_Alto=$Alto_recortado*$ampliacion_Y+2*$margen;
/* dimensiones del area impresa de la imagen resultante
Hay que descontar los márgenes al tamaño de la imagen */
$resultado_Ancho=$papel_Ancho -2*$margen;
$resultado_Alto=$papel_Alto -2*$margen;
switch($tipo){
    case "jpg":
          $copia=imagecreatefromjpeg($original);
      break;
    case "png":
          $copia=imagecreatefrompng($original);
      break;
    case "gif":
          $copia=imagecreatefromgif($original);
    break;
 }
/* creamos la cabecera de la nueva imagen */
  Header("Content-type:image/jpeg"); 
 /* creamos la imagen final asignandole sus dimensiones */
    $ampliada=imagecreatetruecolor($papel_Ancho,$papel_Alto);
    /*ponemos un color de fondo (rojo) que será con el que se visualizarán los márgenes*/
	$fondo=imagecolorAllocate($ampliada,255,0,0);
    /* aplicamos el color de fondo */
	imagefill($ampliada,0,0,$fondo);
    /* incrustamos la imagen */
    imagecopyresampled($ampliada,$copia,$margen,$margen,
                                 $recorte_izq,$recorte_sup,
                                 $resultado_Ancho,$resultado_Alto,
                                 $Ancho_recortado,$Alto_recortado);
     /* visualizamos el resultado */
    imagejpeg($ampliada);
ImageDestroy();
?>
Ver imágenes original y resultante
Ir a la página
anterior
Avisos de error
y/o sugerencias
Ir a la página
Índice
Ir a la página
siguiente