viernes, 30 de diciembre de 2016

Grafica personalizada con GD

A partir de una imágen es posible generar una gráfica porcentual con php y GD, mejor explicado con una imágen:


La gráfica de la izquierda muestra el resultado de la generación de imágen con PHP-GD.
Un porcentaje variable se muestra la imágen normal y al porcentaje restante se le aplican filtros para crear el efecto de pendiente, agregamos el texto conteniendo el porcentaje efectivo que reflejamos en la imágen.

Este es el código para el ejemplo:

<?php
//mostramos errores
ini_set ("display_errors","1" );
error_reporting(E_ALL);

//capturamos el tiempo, este será el nombre del nuevo archivo
$time=time();
//nombre de archivo origen, puede ser local o una url
$archivo='http://php.net/images/logos/php-med-trans.png';
//porcentaje que mostramos
$porc=$_GET['porc'];

//Creamos 2 recursos de imágen, el primero es el que tendrá los filtros de color, el segundo queda normal
$im = imagecreatefrompng($archivo);
$im2 = imagecreatefrompng($archivo);
//Obtenemos las dimensiones de la imágen
$dimensiones=getimagesize ($archivo);

//Validamos el recurso
if($im)
{
//Definimos un color para el texto y bordes
$color_texto = imagecolorallocate($im, 253, 0, 3);
//Dibujamos un rectangulo para delimitar la imágen a un pixel de diferencia del tamaño total
imagerectangle( $im,0, 0, ($dimensiones[0])-1, ($dimensiones[1])-1, $color_texto );
//agregamos el texto en la imágen 2
imagestring($im2, 5, 5, ($dimensiones[1])-20,  $porc."%", $color_texto);

//Aplicamos filtros en la imágen 1
  imagefilter($im,IMG_FILTER_GRAYSCALE);
  imagefilter($im,IMG_FILTER_BRIGHTNESS,95);
//Aplicamos transparencia
  imageAlphaBlending($im, true);
  imageSaveAlpha($im, true);

//definimos las variables de ubicación de la imágen2
$dst_x=0;
$dst_y=$dimensiones[1]-(($porc/100)*$dimensiones[1]);
$src_x=0;
$src_y=$dimensiones[1]-(($porc/100)*$dimensiones[1]);
$src_w=$dimensiones[0];
$src_h=$dimensiones[0];
//superponemos la imágen 2 sobre la 1
imagecopy ($im ,$im2 , $dst_x , $dst_y , $src_x , $src_y , $src_w , $src_h);
//volcamos la imágen a archivo
    imagepng($im, "tmp/".$time.".png");
//Liberamos los recursos
    imagedestroy($im);
    imagedestroy($im2);
//Mostramos la imágen
echo "<p><img src='tmp/".$time.".png'>";
}else {
    //la imágen no es válida
    echo "Im&aacute;gen inv&aacute;lida";
}

?>

para previsualizar solo ingresan la url con el porcentaje así:
http://www.midireccion.com/gauge.php?porc=45
Eso es todo, puede volcarse a una función o integrarse en una clase si es necesario, comentarios serán bien recibidos.



No hay comentarios:

Publicar un comentario