Создание графиков на PHP с помощью JPGraph

автор Дмитрий Носов

5 Ноя 2012

Иногда в рамках интернет проекта возникает потребность в визуализации данных. Представление данных в виде графиков и диаграмм дает возможность наглядно убедиться, например, в увеличении/уменьшении объёмов продаж в текущем году по сравнению с прошлым годом, количества посетителей и пр., вариантов великое множество.

Специально для этих целей, ребята из Asial Corporation, разработали библиотеку JPGraph. Это объектно-ориентированная библиотека для создания графики профессионального качестве при использовании минимум кода, написанная на PHP.

Используя JPGraph, можно создавать графики, диаграммы, captcha картинки и даже географические карты. В бесплатной версии библиотеки доступно большинство возможностей, но имеется также и профессиональная версия, позволяющая разработчику получить доступ к дополнительным функциям JPGraph.

Для работы с JPGraph вам понадобится PHP версии 4.3.1 и выше, а также установленная библиотека GD. Поддерживается как первая, так и вторая версия GD.

Для установки библиотеки вам нужно скачать архив http://jpgraph.net/download/
и распаковать из него директорию src (должна содержать файл jpgraph.php) в свой проект или в директорию, где у вас хранятся общие библиотеки, если вы планируете использовать JPGraph в нескольких проектах на одном сервере.

Разработчики библиотеки настоятельно рекомендуют не располагать библиотеку в директориях доступных извне, и я с ними полностью согласен.

Последнее, что нужно сделать, это убедиться, что GD библиотека подключена и работает. Это можно проверить, заглянув в вывод функции phpinfo().

Итак, библиотека установлена, попробуем создать простенький график.

/*
Подключаем JPGraph (внимание, директория,
содержащая файл jpgraph.php должна присутствовать
в INCLUDE_PATH, иначе нужно указывать путь до неё)
*/
require_once('jpgraph.php');
/*
Подключаем расширение, ответственное за
создание линейных графиков:
*/
require_once('jpgraph_line.php');

// Создадим немного данных для визуализации:
$ydata = array(6, 3, 8, 5, 15, 16, 19);

/*
Массив значений абсцисс опционален, 
его можно не задавать
*/
$xdata = array(0, 1, 2, 3, 4, 5, 6);

/*
Создаем экземпляр класса графика, задаем параметры
изображения: ширина, высота, название файла в кеше,
время хранения изображения в кеше, указываем, выводить
ли изображение при вызове функции Stroke (true)
или только создать и хранить в кеше (false):
*/
$graph = new Graph(400, 300, 'auto', 10, true);

// Указываем, какие оси использовать:
$graph->SetScale('textlin');

/*
Создаем экземпляр класса линейного графика, передадим
ему нужные значения:
*/
$lineplot = new LinePlot($ydata, $xdata);

// Задаём цвет кривой
$lineplot->SetColor('forestgreen');

// Присоединяем кривую к графику:
$graph->Add($lineplot);

// Даем графику имя:
$graph->title->Set('Простой график');

/*
Если планируете использовать кириллицу, то необходимо 
использовать TTF-шрифты, которые её поддерживают,
например arial.
*/
$graph->title->SetFont(FF_ARIAL, FS_NORMAL);
$graph->xaxis->title->SetFont(FF_VERDANA, FS_ITALIC);
$graph->yaxis->title->SetFont(FF_TIMES, FS_BOLD);

// Назовем оси:
$graph->xaxis->title->Set('Время');
$graph->yaxis->title->Set('Деньги');

// Выделим оси цветом:
$graph->xaxis->SetColor('#СС0000');
$graph->yaxis->SetColor('#СС0000');

// Зададим толщину кривой:
$lineplot->SetWeight(3);

// Обозначим точки звездочками, задав тип маркера:
$lineplot->mark->SetType(MARK_FILLEDCIRCLE);

// Выведем значения над каждой из точек:
$lineplot->value->Show();

// Фон графика зальем градиентом:
$graph->SetBackgroundGradient('ivory', 'orange');

// Придадим графику тень:
$graph->SetShadow(4);

/*
Выведем получившееся изображение в браузер (в случае если
при создании объекта graph последний параметр был false, 
изображение будет сохранено в кеше, но не выдано в браузер)
*/

$graph->Stroke();

Данный код при выполнении сгенерирует такое изображение:

Рассмотрим ещё неcколько типов графиков, которые предоставляет JPGraph (здесь я не буду приводить полный код примеров, а только новые строки).

Столбчатая диаграмма

	// Подключаем файл с классами для работы со столбиками
	require_once('jpgraph_bar.php');

	// Создаём один столбик
	$bplot = new BarPlot($xdata);

	$bplot->SetLegend('Инвестиции');

	// Создаём второй столбик
	$bplot2 = new BarPlot($ydata);
	$bplot2->SetLegend('Прибыль');

	// Объединяем столбики
	$accbplot = new AccBarPlot(array($bplot, $bplot2));
	$accbplot->SetColor('darkgray');
	$accbplot->SetWeight(1);

	// Присоединяем столбики к графику:
	$graph->Add($accbplot);

JPGraph также предоставляет возможность генерировать 3D проекции.
Отобразим статистику использования браузеров на 1 сенября 2012 года в виде круговой диаграммы.

	require_once ('jpgraph.php');
	require_once ('jpgraph_pie.php');
	require_once ('jpgraph_pie3d.php');

	// Статистика использования браузеров в процентах
	$data = array(29, 21, 18, 18, 4, 10);
	$legends = array(
    'Crome',
    'IE', 
    'Firefox', 
    'Opera', 
    'Safari', 
    'Другие'
);

	// Создаём график
	$graph = new PieGraph(600, 450);
	$graph->SetShadow();

	// Заголовок графика
	$graph->title->Set('Статистика браузеров 2012');
	$graph->title->SetFont(FF_VERDANA, FS_BOLD, 14); 

	// Расположение "Легенды" (в процентах/100)
	$graph->legend->Pos(0.1, 0.2);

	// Создаём круговую диаграмму 3D
	$p1 = new PiePlot3d($data);

	// Центр круга (в процентах/100)
	$p1->SetCenter(0.45, 0.5);

	// Угол наклона диаграммы
	$p1->SetAngle(30);

	// Шрифт для подписей
	$p1->value->SetFont(FF_ARIAL, FS_NORMAL, 12);

	// Подписи для сегментов диаграммы
	$p1->SetLegends($legends);

	// Присоединяем диаграмму к графику

	$graph->Add($p1);
	// Выводим график

	$graph->Stroke();

Во всех примерах для наглядности использовались данные, введенные вручную, но на практике вы можете использовать данные из любых источников, будь то база данных или текстовый файл.

JPGraph предоставляет ещё очень много инструментов для создания всевозможных графиков, например, комбинирование графиков или использование своих изображений для фонов или контрольных точек. Описание всех возможностей JPGraph потребовало бы написания целого ряда статей.

  • 0 Репосты

Комментарии

Фильтр

Закрыть

Технологии

Индустрии