Шохирев Михаил Васильевич
Шрифт:
use CGI qw/:standard/; # применим библиотеку CGI
use SVG; # и SVG
my $p = CGI->new; # создадим объект CGI и зададим
print $p->header(-type=>'image/svg+xml'); # тип документа
# создадим объект SVG размером 400 на 300 пикселей
my $svg= SVG->new(width=>400, height=>300);
# разместим синий текст, начиная с координат 32,32
$svg->text(x=>32,y=>32,
style=>"font-size:15;fill:blue"
)->cdata('Посещаемость сайта: распределение по доменам');
# вызовем подпрограмму для размещения 4-х полос графика
bar(20, 50, 'red', 55, '.RU');
bar(20, 80, 'blue', 24, '.COM');
bar(20, 110, 'green', 12, '.ORG');
bar(20, 140, 'black', 9, 'прочие');
# разместим текст с версиями программных средств:
$svg->text(x=>12,y=>200,
)->cdata("Perl $] + ". # версия Perl
"SVG.pm $SVG::VERSION + ". # версия модуля SVG
"CGI.pm $CGI::VERSION"); # версия модуля CGI
my $out = $svg->xmlify; # отформатируем текст XML
print $out; # и отправим его браузеру
sub bar { # подпрограмма вывода одной строки графика,
# которой передаются координаты, цвет, % и заголовок
my ($x, $y, $color, $procent, $caption) = @_;
# выводим прямоугольник пропорционально проценту
$svg->rectangle(
x => $x, y => $y,
height => 30, width => $procent*10,
style => "opacity:1; fill:$color; fill-opacity:0.4"
);
# и пояснительный текст указанного цвета
$svg->text(
x=>$x+5,y=>$y+20,style=>"font-size:15;fill:$color"
)->cdata("$caption $procent %");
}
SVG-документ, сформированный в результате выполнения этой программы, - это текстовый файл в формате XML, который выглядит следующим образом:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg height="300" width="400">
<text style="font-size:15;fill:blue" x="32" y="32">
Ïîñåùàåìîñòü
ñàéòà:
ðàñïðåäåëåíèå
ïî äîìåíàì
</text>
<rect height="30" width="550" x="20" y="50"
style="opacity:1; fill:red; fill-opacity:0.4" />
<text style="font-size:15;fill:red" x="25" y="70">
.RU 55 %
</text>
<rect height="30" width="240" x="20" y="80"
style="opacity:1; fill:blue; fill-opacity:0.4" />
<text style="font-size:15;fill:blue" x="25" y="100">
.COM 24 %
</text>
<rect height="30" width="120" x="20" y="110"
style="opacity:1; fill:green; fill-opacity:0.4" />
<text style="font-size:15;fill:green" x="25" y="130">
.ORG 12 %
</text>
<rect height="30" width="90" x="20" y="140"
style="opacity:1; fill:black; fill-opacity:0.4" />
<text style="font-size:15;fill:black" x="25" y="160">