Диаграммы в PHP

23 мая 2020 - Администратор

Построение графических диаграмм в PHP

В этой статье мы разберём, как строить графические диаграммы в PHP. Мы напишем PHP скрипт, в котором с помощью HTML формы вводится рацион питания, рассчитывается количество белков, углеводов и жиров, потребление визуализируется  в форме прямоугольной диаграммы и сравнивается с нормой. Это полноценное приложение на PHP для анализа вашего рациона питания. Чтобы создать такое веб приложение нам необходимо выполнить следующие шаги 
Разработаем HTML форму ввода реального рациона потребления, в ней будет три поля - употребление белков, жиров и углеводов. 
Форма обрабатывается в PHP обработчике. 
Рассчитываются коэффициенты потребления белков, жиров, углеводов.
Рассчитываются нормировочные коэффициенты для визуализации(чтобы диаграмма не выходила за границы).  
Для каждого прямоугольника диаграммы определяется свой цвет, исходя из значений нормировочного коэффициента. Чем больше коэффициент, тем ярче  цвет
Рисуются прямоугольники диаграммы для каждого параметра, исходя  из нормировочных коэффициентов. Чем больше коэффициент,  тем выше прямоугольник
Выводятся пояснительные надписи.
Рисуются нормативные значения для каждого параметра в виде красных рамок.
Описание PHP скрипта для анализа рациона
Создаём форму ввода реального пищевого рациона. В форме есть 3 текстовых поля формы HTML для ввода параметров и кнопка Submit. Подробнее о работе с HTML формами
<p><h1>Рацион питания</h1></p>
<form method="post">
<p>Сколько вы употребляете мяса?(в граммах)</p>
<p><input type="text" name="meat"></p>
<p>Сколько вы употребляете растительных жиров?(в граммах)</p>
<p><input type="text" name="jir"></p>
<p>Сколько вы употребляете сладкого?(в граммах)</p>
<p><input type="text" name="sweet"></p>
<input type="submit" name="formSubmit" value="Submit" />
</form>

Разработаем PHP обработчик HTML формы. При  нажатии кнопки "Submit" происходит обработка формы и значения полей формы используются для расчёта коэффициентов с помощью глобального массива $_POST
if(isset($_POST['formSubmit'])) {
$nameform=$_POST['rb'];
$k1= round($_POST['meat']*0.08);
$k2= round($_POST['jir']*0.09);
$k3= round($_POST['sweet']*0.09);
}

Создаём изображение. Подробнее о работе с изображениями в PHP
$image = imagecreatetruecolor(500, 500);
$bg = imagecolorallocate($image, 200, 200, 200);

imagefill($image, 0, 0, $bg);
Задаём нормировочные коэффициенты для цветов прямоугольников в  диаграмме и для размеров, чтобы прямоугольники не выходили за границы диаграммы и границы палитры. Если значения параметров выходят за границы, присваиваем им максимальное значение размера и цвета. Исходя из норм потребления, задаём параметры для размеров рамок нормального значения.
$col1=$k1*5;
$col2=$k2*5;
$col3=$k3*5;
$knpr=70;
$knj=100;
$knu=380;
$size1=$k1*10;
$size2=$k2*10;
$size3=$k3*10;
if ($k1>45) $size1=450;
if ($k2>45) $size2=450;
if ($k3>45) $size3=450;
if ($k1>50) $col1=255;
if ($k2>50) $col2=255;
if ($k3>50) $col3=255;

Задаём цвета прямоугольников, исходя из нормировочных коэффициентов. Чем больше нормировочный коэффициент, тем насыщеннее будет цвет. Задаём цвет пояснительных надписей.
$col_rectangle1 = imagecolorallocate($image, 255-$col1, 255, 255);
$col_rectangle2 = imagecolorallocate($image, 255-$col2, 255, 255);
$col_rectangle3 = imagecolorallocate($image, 255-$col3, 255, 255);
$col_nrectangle1 = imagecolorallocate($image, 255, 0, 0);
$col_nrectangle2 = imagecolorallocate($image, 255, 0, 0);
$col_nrectangle3 = imagecolorallocate($image, 255, 0, 0);
$col_text = imagecolorallocate($image, 0, 0, 0);

Рисуем прямоугольники значений реального потребления, исходя из нормировочных коэффициентов для данных, введённых пользователем.
imagefilledrectangle ($image , 10 , 490 , 160 , 490-$size1 ,$col_rectangle1);
imagefilledrectangle ($image , 170 , 490 , 320 , 490-$size2 ,$col_rectangle2);
imagefilledrectangle ($image , 330 , 490 , 480 , 490-$size3 ,$col_rectangle3);

Рисуем рамки нормальных значений рациона
imagerectangle ($image , 5 , 490 , 165 , 490-$knpr ,$col_nrectangle1);
imagerectangle ($image , 165 , 490 , 325 , 490-$knj ,$col_nrectangle2);
imagerectangle ($image , 325, 490 , 485 , 490-$knu ,$col_nrectangle3);

Делаем пояснительные надписи на диаграмме
imagerectangle ($image , 5 , 490 , 165 , 490-$knpr ,$col_nrectangle1);
imagerectangle ($image , 165 , 490 , 325 , 490-$knj ,$col_nrectangle2);
imagerectangle ($image , 325, 490 , 485 , 490-$knu ,$col_nrectangle3);

Сохраняем изображение в файл и освобождаем память.
imagepng($image, './1.png');
imagedestroy($image);

С помощью HTML тега выводим изображение на веб страницу
<p><img src="1.png" width="500" height="500" alt="pascal" ></p>
Полный код PHP скрипта для анализа рациона питания 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Рационы</title>
</head>
<body>
<p><h1>Рацион питания</h1></p>
<form method="post">
<p>Сколько вы употребляете мяса?(в граммах)</p>
<p><input type="text" name="meat"></p>
<p>Сколько вы употребляете растительных жиров?(в граммах)</p>
<p><input type="text" name="jir"></p>
<p>Сколько вы употребляете сладкого?(в граммах)</p>
<p><input type="text" name="sweet"></p>
<input type="submit" name="formSubmit" value="Submit" />
</form>
<p><hr>Ваш рацион выделен голубым цветом, красным отображена норма</p>
<?php
if(isset($_POST['formSubmit'])) {
$nameform=$_POST['rb'];
$k1= round($_POST['meat']*0.08);
$k2= round($_POST['jir']*0.09);
$k3= round($_POST['sweet']*0.09);
}
$image = imagecreatetruecolor(500, 500);
$bg = imagecolorallocate($image, 200, 200, 200);
imagefill($image, 0, 0, $bg);
$col1=$k1*5;
$col2=$k2*5;
$col3=$k3*5;
$knpr=70;
$knj=100;
$knu=380;
$size1=$k1*10;
$size2=$k2*10;
$size3=$k3*10;
if ($k1>45) $size1=450;
if ($k2>45) $size2=450;
if ($k3>45) $size3=450;
if ($k1>50) $col1=255;
if ($k2>50) $col2=255;
if ($k3>50) $col3=255;
$col_rectangle1 = imagecolorallocate($image, 255-$col1, 255, 255);
$col_rectangle2 = imagecolorallocate($image, 255-$col2, 255, 255);
$col_rectangle3 = imagecolorallocate($image, 255-$col3, 255, 255);
$col_nrectangle1 = imagecolorallocate($image, 255, 0, 0);
$col_nrectangle2 = imagecolorallocate($image, 255, 0, 0);
$col_nrectangle3 = imagecolorallocate($image, 255, 0, 0);
$col_text = imagecolorallocate($image, 0, 0, 0);
imagefilledrectangle ($image , 10 , 490 , 160 , 490-$size1 ,$col_rectangle1);
imagefilledrectangle ($image , 170 , 490 , 320 , 490-$size2 ,$col_rectangle2);
imagefilledrectangle ($image , 330 , 490 , 480 , 490-$size3 ,$col_rectangle3);
imagerectangle ($image , 5 , 490 , 165 , 490-$knpr ,$col_nrectangle1);
imagerectangle ($image , 165 , 490 , 325 , 490-$knj ,$col_nrectangle2);
imagerectangle ($image , 325, 490 , 485 , 490-$knu ,$col_nrectangle3);
imagestring ($image , 4 , 85 , 485 ,'Protein' , $col_text );
imagestring ($image , 4 , 245 , 485 ,'Fats' , $col_text );
imagestring ($image , 4 , 405 , 485 ,'Carbohydrates' , $col_text );
imagestring ($image , 5 , 85 , 470 , $k1, $col_text );
imagestring ($image , 5 , 245 , 470 , $k2, $col_text );
imagestring ($image , 5 , 405 , 470 , $k3, $col_text );
imagepng($image, './1.png');
imagedestroy($image);
?>
<p><img src="1.png" width="500" height="500" alt="diag" ></p>
</body>
</html>

Пример работы  PHP скрипта для анализа раицона питания

прямоугольная диаграмма в php

Вернуться к содержанию курса по PHP   Перейти к теме Сессии в PHP >>
 

Полезно : Регистрация домена и размещение сайта на хостинге

Поделиться 

 
 
Комментарии (0)

Нет комментариев. Ваш будет первым!