62 Php. Creando Imagenes
- 1. Creando imágenes Creación de imágenes dinámicas Una primera imagen Una imagen dinámica es tan sólo <? un script que contiene las Header("Content-type: image/jpeg"); instrucciones para la creación de esa imagen. $im = imagecreate(200,200); Para visualizar una imagen Imagejpeg($im); dinámica desde una página web basta con invocar el fichero que Imagedestroy($im); contiene el script desde la etiqueta clásica de inserción de imágenes de HTML ?> <img src="imgxx.php"> Ver img1.php donde imgxx.php será el nombre del script que genera la imagen. ¡Cuidado! Primera etiqueta No dejes NUNCA líneas en blanco entre la etiqueta <? de comienzo del script y la línea que contiene Header Una vez conocidos los formatos Si escribiéramos el script anterior sustituyendo image/jpeg por image/png e Imagejpeg que soporta nuestra versión, ya ($im) por Imagepng($im) no visualizaríamos nada. podemos generar imágenes El formato jpg –a falta de especificaciones– considera la imagen con negro como color de utilizando cualquiera de esos fondo, pero png requiere que ese color sea especificado. formatos. Trabajaremos con dos de ellos: JPG y PNG. La primera instrucción que ha de Añadir un color de fondo contener cualquier script que deba generar imágenes ha de ser la <? siguiente: Header("Content-type: image/jpeg"); Header("Content-type: image/ jpeg") $im = imagecreate(200,200); si se trata de crear una imagen $fondo=imagecolorallocate ($im, 0, 0, 200); JPG o: Header("Content-type: image/ Imagefill ($im, 0, 0, $fondo); png") Imagejpeg($im); si pretendemos que la imagen tenga formato PNG. Imagedestroy($im); ?> ¡Cuidado! Cualquier etiqueta header Ver img2.php (cabecera) ha de incluirse obligatoriamente al comienzo del script antes que ninguna otra instrucción y sin ninguna línea en <? blanco que la preceda. Header("Content-type: image/png"); Pondremos siempre estas $im = imagecreate(200,200); instrucciones inmediatamente debajo de <? sin que las separe $fondo=imagecolorallocate ($im, 0, 0, 200); ninguna línea en blanco. Imagefill ($im, 0, 0, $fondo); Creación de imágenes Imagepng($im); Imagedestroy($im); Definida la etiqueta anterior ?> tenemos que: crear la imagen, dibujarla y luego enviarla al navegador para que pueda ser Ver img3.php visualizada y, por último, (no es imprescindible pero si muy Dibujar un rectángulo sin relleno conveniente) borrarla, con el fin de liberar la memoria del servidor ocupada durante el proceso de <? generación de la misma. Header("Content-type: image/jpeg"); $im = imagecreate(200,200); Estas son las funciones PHP para $fondo=imagecolorallocate ($im, 0, 0, 200); esos procesos: $blanco=imagecolorallocate ($im, 255, 255, 255); $nom = imagecreate(anc,al) Imagefill ($im, 0, 0, $fondo); Con esta función se crea una imagerectangle ($im, 10, 10, 190, 190, $blanco); imagen del tamaño indicado en los parámetros anc y al (en pixels) Imagejpeg($im); que será recogida en la variable nom. Imagedestroy($im); Esta función es idéntica para cualquier formato de imagen. ?> Envío de imágenes al Ver img4.php navegador
- 2. Para enviar imágenes al navegador <? (visualización) se usan funciones Header("Content-type: image/png"); diferentes según el tipo de imagen definida en Header. $im = imagecreate(200,200); Si pretendemos que la imagen tenga formato JPG habremos $fondo=imagecolorallocate ($im, 0, 0, 200); puesto en Header la indicación $blanco=imagecolorallocate ($im, 255, 255, 255); jpeg (¡cuidado! observa la sintaxis... jpeg). En este caso la Imagefill ($im, 0, 0, $fondo); función de visualización será: imagerectangle ($im, 10, 10, 190, 190, $blanco); Imagejpeg($nom) Si se tratara de una imagen en Imagepng($im); formato PNG (recuerda que debe estar definido en Header) la Imagedestroy($im); sintaxis sería: ?> Imagepng($nom) Eliminando imágenes de Ver img5.php la memoria Para borrar imágenes de la Dibujando un rectángulo con relleno memoria del servidor (que no del navegador) se utiliza la siguiente sintaxis: Imagedestroy($nom) <? Header("Content-type: image/jpeg"); Creando colores $im = imagecreate(200,200); PHP permite crear una paleta de $fondo=imagecolorallocate ($im, 0, 0, 200); colores. Para ello se pueden crear $blanco=imagecolorallocate ($im, 255, 255, 255); variables de color (con $amarillo=imagecolorallocate ($im, 255, 255,0); independencia del formato utilizado) mediante la siguiente Imagefill ($im, 0, 0, $fondo); función: imagerectangle ($im, 10, 10, 190, 190, $blanco); $color=imagecolorallocate imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); ($nom,R,G,B) Imagejpeg($im); donde la variable recoge el color resultante de mezclar los colores Imagedestroy($im); primarios indicados en R, G y B que serán números enteros comprendidos entre 0 y 255 y que ?> especifican la intensidad de las luces roja, verde y azul utilizadas para la obtención del color. Ver img6.php Se pueden definir tantos colores como se deseen tan sólo con <? utilizar nombres de variables Header("Content-type: image/png"); distintos para cada uno de ellos. Aplicar colores de fondo $im = imagecreate(200,200); Para aplicar un color de fondo a $fondo=imagecolorallocate ($im, 0, 0, 200); una imagen (no importa el tipo del $blanco=imagecolorallocate ($im, 255, 255, 255); formato) se utiliza la siguiente $amarillo=imagecolorallocate ($im, 255, 255,0); función: Imagefill ($im, 0, 0, $fondo); imagerectangle ($im, 10, 10, 190, 190, $blanco); Imagefill($nom,x,y,$col) imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); Aquí $nom es la variable que contiene la imagen, x e y son las coordenadas del punto de la Imagepng($im); imagen a partir del cual se aplica el relleno y $col el color Imagedestroy($im); (previamente definido) que se pretende aplicar a la imagen. ?> Mediante esta función todos los puntos colindantes con el de Ver img7.php coordenadas x,y que tengan su mismo color serán rellenados con el color especificado en la variable $col. Dibujando un polígono relleno Rectángulos sin relleno Para dibujar un rectángulo sin <? relleno (solo las líneas) se utiliza la Header("Content-type: image/jpeg"); siguiente función: $esquinas=array(20,100,100,180,180,100,100,20); imagerectangle( $nom, x0, y0, x1, y1, $col) $im = imagecreate(200,200); Donde $nom es el nombre de la imagen, x0, y0 son las $fondo=imagecolorallocate ($im, 0, 0, 200); $blanco=imagecolorallocate ($im, 255, 255, 255); coordenadas del vértice superior izquierdo y x1, y1 las $amarillo=imagecolorallocate ($im, 255, 255,0); Imagefill ($im, 0, 0, $fondo); coordenadas del vértice inferior derecho y $col el color que imagerectangle ($im, 10, 10, 190, 190, $blanco); pretendemos asignar a las líneas imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo);
- 3. del rectángulo. imagefilledpolygon ($im, $esquinas, 4, $blanco); El punto (0,0) siempre es la esquina superior izquierda de la imagen y recuerda que si no usas – Imagejpeg($im); en las líneas– un color distinto al del fondo no se visualizará el Imagedestroy($im); rectángulo. ?> Rectángulos con relleno Ver img8.php Para dibujar un rectángulo con relleno se utiliza la siguiente función: <? Header("Content-type: image/png"); imagefilledrectangle( $nom, x0, y0, x1, y1, $col) $esquinas=array(20,100,100,180,180,100,100,20); Los parámetros son idénticos a los $im = imagecreate(200,200); del caso anterior con la única diferencia de que en este caso el rectángulo aparecerá relleno con el $fondo=imagecolorallocate ($im, 0, 0, 200); color elegido. $blanco=imagecolorallocate ($im, 255, 255, 255); $amarillo=imagecolorallocate ($im, 255, 255,0); Imagefill ($im, 0, 0, $fondo); Polígonos con relleno imagerectangle ($im, 10, 10, 190, 190, $blanco); imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); Para colorear el fondo de un polígono son necesarias dos imagefilledpolygon ($im, $esquinas, 4, $blanco); operaciones: Imagepng($im); s Crear un array con las coordenadas de cada uno Imagedestroy($im); de sus vértices. s Aplicar la función que ?> dibuja polígonos de este tipo. Ver img9.php La creación del array podría hacerse así: $v=(x0, y0, x1, y1,... xn, yn ) Dibujando un polígono sin relleno donde se irían introduciendo las coordenadas de los sucesivos vértices del polígono (x e y de cada vértice). <? Header("Content-type: image/jpeg"); La creación de un polígono de este tipo requiere la siguiente función: $esquinas=array(20,100,100,180,180,100,100,20); imagefilledpolygon($nom, $vert, nº vert , $col) $im = imagecreate(200,200); donde $nom es el nombre de la $fondo=imagecolorallocate ($im, 0, 0, 200); imagen, $vert es el array que $blanco=imagecolorallocate ($im, 255, 255, 255); contiene las coordenadas de los $amarillo=imagecolorallocate ($im, 255, 255,0); vértices, nº vert es el número de Imagefill ($im, 0, 0, $fondo); vértices y $col es el color de imagerectangle ($im, 10, 10, 190, 190, $blanco); relleno. imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); Polígonos sin relleno imagepolygon ($im, $esquinas, 4, $blanco); Su funcionamiento es idéntico al Imagejpeg($im); anterior en tanto requiere que se defina el array de coordenadas de Imagedestroy($im); los vértices y los parámetros de la función son los mismos indicados ?> en el caso anterior. Sólo se modifica el nombre de la función que en este caso es: Ver img10.php imagepolygon( $nom, $vert, nº vert , $col) <? Header("Content-type: image/png"); Elipses, circunferencias y arcos $esquinas=array(20,100,100,180,180,100,100,20); Una misma función nos permite $im = imagecreate(200,200); dibujar elipses, circunferencias y arcos. Es la siguiente: $fondo=imagecolorallocate ($im, 0, 0, 200); $blanco=imagecolorallocate ($im, 255, 255, 255); imagearc($nom, Xc, Yc , a, b, Gi, $amarillo=imagecolorallocate ($im, 255, 255,0); Gf, $col) Imagefill ($im, 0, 0, $fondo); imagerectangle ($im, 10, 10, 190, 190, $blanco); Los parámetros de esta función son los siguientes: imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); imagepolygon ($im, $esquinas, 4, $blanco); r $nom es el nombre de la imagen. Imagepng($im); r Xc e Yc las coordenadas del centro de la elipse. r a es la longitud del eje Imagedestroy($im); horizontal de la elipse. r b es la longitud del eje ?> vertical de la elipse.
- 4. r Gi es el punto inicial del Ver img11.php arco y se expresa en grados sexagesimales. r Gf es el punto final del arco también en grados sexagesimales. Dibujando circunferencias, elipses y arcos r $col es el color con el que se dibujará la línea. Respecto a los ángulos, CERO <? GRADOS coincide con el cero $esquinas=array(20,100,100,180,180,100,100,20); trigonométrico pero el sentido es $im = imagecreate(200,200); contrario, es decir, el de las agujas $fondo=imagecolorallocate ($im, 0, 0, 200); del reloj. $blanco=imagecolorallocate ($im, 255, 255, 255); Obviamente, para dibujar una $amarillo=imagecolorallocate ($im, 255, 255,0); circunferencia basta con hacer Imagefill ($im, 0, 0, $fondo); iguales los valores de a y de b y imagerectangle ($im, 10, 10, 190, 190, $blanco); fijar los puntos inicial y final en 0º imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); y 360º respectivamente. imagepolygon ($im, $esquinas, 4, $blanco); imagearc ($im, 100, 100, 160, 160, 0, 360, $fondo); Dibujando sobre una imagearc ($im, 100, 100, 160, 100, 0, 360, $rojo); imagen de fondo Imagejpeg($im); PHP permite crear imágenes utilizando como fondo una Imagedestroy($im); preexistente. Para ello basta con crear una variable indicando el ?> path y el nombre de la imagen, por ejemplo: $b="./images/cruz.jpg" Ver img12.php El formato de esta imagen debe coincidir con el de la que <? pretendemos construir. Header("Content-type: image/png"); $esquinas=array(20,100,100,180,180,100,100,20); Una vez definida esta variable $im = imagecreate(200,200); bastará sustituir la instrucción de creación de imagen $fondo=imagecolorallocate ($im, 0, 0, 200); $blanco=imagecolorallocate ($im, 255, 255, 255); $nom = imagecreate(x,y) $amarillo=imagecolorallocate ($im, 255, 255,0); Imagefill ($im, 0, 0, $fondo); por: imagerectangle ($im, 10, 10, 190, 190, $blanco); imagefilledrectangle ($im, 20, 20, 180, 180, $amarillo); $nom= imagecreatefrompng ($b) imagepolygon ($im, $esquinas, 4, $blanco); en el caso de imágenes PNG o por: imagearc ($im, 100, 100, 160, 160, 0, 360, $fondo); imagearc ($im, 100, 100, 160, 100, 0, 360, $rojo); $nom= imagecreatefromjpeg ($b) Imagepng($im); si se tratara de imágenes en formato JPG. Imagedestroy($im); El resultado del cambio en el ?> primero de los casos es este y aquí tienes también la imagen obtenida utilizando un fondo en formato JPG. Ver img13.php Una advertencia al respecto. Como puedes comprobar en los ejemplos, el tamaño de la imagen Utilizando imágenes dinámicas es el mismo de la utilizada como fondo. En todos los ejemplos anteriores hemos podido visualizar las imágenes con sólo llamarlas desde el navegador, de la misma forma que podríamos visualizar cualquier otra imagen. Guardando imágenes Pero las imágenes dinámicas pueden ser insertadas en una página web de la misma Las imágenes que son creadas forma que cualquier otra imagen. mediante la sintaxis anterior no se guardan en servidor. Aquí tienes un ejemplo donde se recogen en una página web todas las imágenes dinámicas creadas anteriormente. Si se pretende guardarlas hay que modificar la sintaxis de las etiquetas: ejemplo103.php Imagepng($nombre) Si observas el código fuente verás que es exactamente el mismo que se utiliza para insertar una imagen normal, con la única diferencia de que aquí el nombre de la o imagen será el mismo que el del fichero PHP que la genera. Imagejpeg($nombre) añadiendo otro parámetro con el Anterior Indice Siguiente nombre y la extensión del fichero que vamos de guardar. Así por ejemplo: Imagepng( $nombre, "mi_imagen.png") o Imagejpeg( $nombre, "mi_imagen.jpg") guardarían en el servidor las imágenes creadas con los nombres mi_imagen.png o mi_imagen.
- 5. jpg