Posts Tagged ‘gd’

Barras de progreso dinámicas en PHP

Thursday, March 20th, 2008

Bueno, hace unos días que empecé a jugar un poco con la librería GD y PHP, y a la hora de desarollar un sitio, mientras más recicles código es mucho mejor. En esta ocasión hice un pequeño script para crear barras de progreso dinámicas con PHP, este es un ejemplo: Barra de progreso 50% llena
La imagen que usé de fondo es esta: fondo.png<?php
/* variables del porcentaje de largo que queremos mostrar lleno y la paleta de colores en formato RGB (ej: image_bar.php?width=50&palet=0/102/53*/
$width = $_GET['width'];
$palet = $_GET['palet'];
/* verificamos la variable palet que guarda la paleta de colores y separamos los colores RGB*/
if ($palet)
{
$arr_palet = split('/',$palet);
$arraycolor[0] = array($arr_palet[0], $arr_palet[1], $arr_palet[2]);
for($i = 1; $i < 9; $i++)
{
if (($arr_palet[0] + 10) > 255) $arr_palet[0] = 255;
else $arr_palet[0] = $arr_palet[0] + 10;
if (($arr_palet[1] + 10) > 255) $arr_palet[1] = 255;
else $arr_palet[1] = $arr_palet[1] + 10;
if (($arr_palet[2] + 10) > 255) $arr_palet[2] = 255;
else $arr_palet[2] = $arr_palet[2] + 10;
$arraycolor[$i] = array($arr_palet[0], $arr_palet[1], $arr_palet[2]);
}
}
$data = ($width * 48 / 100);
$data = round($data);
/* Crear imagen a partir de otra*/
$background = @imagecreatefrompng ('fondo.png');
if ($data > 1)
{
$fill1 = imagecreatetruecolor($data,1);
$fill2 = imagecreatetruecolor($data,1);
$fill3 = imagecreatetruecolor($data,1);
$fill4 = imagecreatetruecolor($data,1);
$fill5 = imagecreatetruecolor($data,1);
$fill6 = imagecreatetruecolor($data,1);
$fill7 = imagecreatetruecolor($data,1);
$fill8 = imagecreatetruecolor($data,1);
$fill9 = imagecreatetruecolor($data,1);
$colors = array(
array(
array('62','125','179'), array('72','133','184'), array('82','140','190'),
array('93','149','195'), array('103','157','200'), array('114','165','206'),
array('127','174','211'), array('135','182','216'), array('190','190','221')
),
array(
array('181','59','59'), array('189','69','69'), array('191','80','80'),
array('197','90','90'), array('202','101','101'), array('208','111','111'),
array('213','121','121'), array('218','132','132'), array('223','142','142')
),
array(
array('10','60','70'), array('20','70','80'), array('30','80','90'),
array('40','90','100'), array('50','101','110'), array('60','111','120'),
array('70','121','130'), array('80','132','140'), array('90','142','150')
),
$arraycolor
);
/* creamos los colores a usar */
$c1 = imagecolorallocate($fill1, $colors[$color][0][0], $colors[$color][0][1], $colors[$color][0][2]); //Background
$c2 = imagecolorallocate($fill2, $colors[$color][1][0], $colors[$color][1][1], $colors[$color][1][2]); //Background
$c3 = imagecolorallocate($fill3, $colors[$color][2][0], $colors[$color][2][1], $colors[$color][2][2]); //Background
$c4 = imagecolorallocate($fill4, $colors[$color][3][0], $colors[$color][3][1], $colors[$color][3][2]); //Background
$c5 = imagecolorallocate($fill5, $colors[$color][4][0], $colors[$color][4][1], $colors[$color][4][2]); //Background
$c6 = imagecolorallocate($fill6, $colors[$color][5][0], $colors[$color][5][1], $colors[$color][5][2]); //Background
$c7 = imagecolorallocate($fill7, $colors[$color][6][0], $colors[$color][6][1], $colors[$color][6][2]); //Background
$c8 = imagecolorallocate($fill8, $colors[$color][7][0], $colors[$color][7][1], $colors[$color][7][2]); //Background
$c9 = imagecolorallocate($fill9, $colors[$color][8][0], $colors[$color][8][1], $colors[$color][8][2]); //Background
/* formamos el degradado */
imagefilledrectangle($fill1, 0, 0, $data, 1, $c1);
imagefilledrectangle($fill2, 0, 0, $data, 1, $c2);
imagefilledrectangle($fill3, 0, 0, $data, 1, $c3);
imagefilledrectangle($fill4, 0, 0, $data, 1, $c4);
imagefilledrectangle($fill5, 0, 0, $data, 1, $c5);
imagefilledrectangle($fill6, 0, 0, $data, 1, $c6);
imagefilledrectangle($fill7, 0, 0, $data, 1, $c7);
imagefilledrectangle($fill8, 0, 0, $data, 1, $c8);
imagefilledrectangle($fill9, 0, 0, $data, 1, $c9);
/* formamos la barra de progreso*/
imagecopy($background,$fill1,1,9,0,0,$data,1);
imagecopy($background,$fill2,1,8,0,0,$data,1);
imagecopy($background,$fill3,1,7,0,0,$data,1);
imagecopy($background,$fill4,1,6,0,0,$data,1);
imagecopy($background,$fill5,1,5,0,0,$data,1);
imagecopy($background,$fill6,1,4,0,0,$data,1);
imagecopy($background,$fill7,1,3,0,0,$data,1);
imagecopy($background,$fill8,1,2,0,0,$data,1);
imagecopy($background,$fill9,1,1,0,0,$data,1);
}
/* mandamos las cabeceras, el archivo es una imagen*/
header("Content-type: image/png");
/* mandamos la imagen */
imagepng($background);
?>

Modo de uso:
image_bar.php?width=porcentaje&palet=R/G/B