Para representar las imágenes necesitas saber siempre el tamaño final del gráfico que vas a crear. Si tienes que representar una barra en, digamos, 700 puntos de ancho, pero esa barra en realidad está representando datos muchos mayores, tienes que hacer una reducción de los datos, o una regla de tres.
Ejemplo. Tu cadena de datos va desde el 0 hasta el 28000. Tu barra gráfica sólo tendrá 700 puntos de ancho. Eso quiere decir que cada pixel de ancho de la barra está representando 40 unidades de la cadena. Y si un tramo empieza en el valor 1400, quiere decir que tienes que pintarle en el pixel 35.
Una forma sencilla de hacer gráficos es utilizando la librería GD:
- Código: Seleccionar todo
1 #!/usr/bin/perl
2
3 use GD;
4 use strict;
5
6 # Dimensiones de la barra
7 my $barra_alto = 20;
8 my $barra_ancho= 700;
9
10 # Dimensiones de la cadena
11 my $cadena_largo= 28000;
12
13 # Relación cadena/barra
14 my $r = $cadena_largo / $barra_ancho;
15
16 # Valores de los tramos encontrados, en la forma inicio => longitud
17 # Los valores indicados aquí son con respecto a los valores de la
18 # cadena, no de la barra a dibujar
19 my %tramos = (
20 2300 => 1240,
21 4500 => 6500,
22 13800 => 900,
23 25000 => 1500,
24 );
25
26 # crear una nueva imagen
27 my $img = GD::Image->new($barra_ancho,$barra_alto);
28
29 # definición de colores
30 my $color_blanco = $img->colorAllocate(255,255,255);
31 my $color_negro = $img->colorAllocate(0,0,0);
32 my $color_rojo = $img->colorAllocate(255,0,0);
33
34 # hacer el fondo de color blanco, transparente e interlazado
35 $img->transparent($color_blanco);
36 $img->interlaced('true');
37
38 # Poner un borde negro alrededor de la barra
39 $img->rectangle(0,0,$barra_ancho-1,$barra_alto-1,$color_negro);
40
41 # Para todos los tramos, pintamos rectángulos rellenos
42 foreach my $inicio ( keys %tramos ) {
43 my $longitud = $tramos{$inicio};
44
45 # Hacemos la cuenta para saber el tamaño del rectángulo a pintar
46 # $x es el origen de dibujo del rectángulo, y
47 # $w es su ancho
48 my $x = $inicio / $r;
49 my $w = $longitud / $r;
50
51 # Pintamos el rectángulo relleno según el inicio y la longitud
52 $img->filledRectangle($x,0,$x+$w,$barra_alto-1,$color_rojo);
53
54 # Alrededor del rectángulo ponemos un marco negro
55 $img->rectangle($x,0,$x+$w,$barra_alto-1,$color_negro);
56 }
57
58 # Grabación de la barra
59 open my $fh, ">grafico.png";
60 binmode $fh;
61 print $fh $img->png;
62 close $fh;
63
En las líneas 7 y 8 definimos el tamaño de la barra a dibujar. Será un simple rectángulo.
En la 11, la longitud de la cadena, o dicho de otra forma, el valor máximo de nuestros valores a representar.
En la 14, calculamos cuantas unidades de la cadena representa cada pixel de la barra.
De la 19 a 24 metemos unos cuantos valores de prueba. Fíjate que son valores dentro del rango de la cadena, no de la barra.
En la 27, creamos la imagen.
De la 30 a la 32 creamos unos cuantos colores. El primer color definido de esta forma servirá además como color de fondo de la imagen.
En la 35 decimos que, además, ese color blanco sea transparente. Esto es opcional, claro, y se puede quitar.
En la 36, decimos que la imagen resultante se grabe con la opción de interlazado, para que los navegadores puedan presentar la imagen aunque no haya terminado de llegar completamente. Esta opción sólo es necesaria en gráficos muy grandes o conexiones a internet muy lentas.
En la 39 pintamos el rectángulo negro que bordea toda la imagen. Observa que las coordenadas empiezan en 0, por lo que el ancho y alto han de ser uno menos que los valores que tenemos.
De la 42 a la 56 tenemos un bucle por todos los tramos a representar que hemos metido de ejemplo antes en %tramos.
En la 43 extraemos el valor del tramo, mejor dicho, su longitud.
En la 48 y 49 transformamos los valores de $inicio y $longitud del espacio dentro de la cadena al espacio de nuestra barra. Una simple regla de tres.
En la 52 pintamos un rectángulo relleno según esos valores y en la siguiente la bordeamos en negro.
Finálmente, de la 59 a la 62 grabamos el resultado, en formato png.
El resultado lo puedes ver en:
http://JoaquinFerrero.com/grafico.png