Рисование графиков php. Создание графики на PHP. Усовершенствуем PHP код
Для того чтобы определить области применения средств создания графики в сценариях для веб, рассмотрим приведенный ниже ряд возможных вариантов использования графики:
- На HTML-страницу могут быть внедрены статические изображения, созданные самостоятельно или заимствованные где-либо.
- Могут быть использованы формируемые программным путем изображения (HTML + CSS).
- Можно использовать библиотеку gd, чтобы заранее создавать статические графические изображения для всех возможных ситуации, возникающих в ходе выполнения сценария, сохранять их в файлах и отображать по условию.
Вариант внедрения графики с использованием статических изображений мы рассматривать не будем ввиду его простоты, поэтому сначала рассмотрим простой вариант (графика HTML + CSS), а затем рассмотрим использование библиотеки gd в PHP.
Графика HTML + CSSПосетителям веб-сайтов хорошо знакомы горизонтальные гистограммы с окрашенными сторонами, которые особенно часто используются для иллюстрации результатов опросов. На первый взгляд складывается впечатление, будто для создания таких диаграмм применяются какие-то графические средства, но в действительности для этого достаточно использовать несколько простых сценариев:
Работа с графикой в PHP, HTML, CSS /* CSS-стили, формирующие оформление */ body div { height: 1em; display: inline-block; vertical-align: middle } span { display: inline-block; width: 120px } .orange { background: orange } .apple { background: #33CC66 } .banana { background: yellow } .tomato { background: red } .cucumber { background: green } .potato { background: gray } Форма заказа Фрукты Апельсины Яблоки Бананы Овощи Помидоры Огурцы Картошка
Данный пример не демонстрирует каких-то новых возможностей PHP, а просто показывает простой способ создания графики с помощью HTML и CSS (в данном случае гистограмм):
Графические средства, описанные в предыдущем разделе, практически исчерпывают возможности стандартного кода HTML (правда стоит отметить, что мы не рассмотрели достаточно мощное средство создания графики HTML5 Canvas). Теперь перейдем к описанию методов создания действительно произвольной графики с использованием библиотеки gd.
Общее описание библиотеки gdВообще говоря, комплект инструментальных средств gd представляет собой библиотеку кода на языке C, предназначенную для создания изображений и манипулирования ими. Эта библиотека была первоначально разработана и предоставлена во всеобщее пользование талантливыми и великодушными сотрудниками компании Boutell.com.
Библиотека gd сама по себе не является графической программой или программой рисования, а также не представляет собой автономное приложение или графический интерфейс пользователя. Вместо этого библиотека gd предоставляет функции, которые могут быть вызваны на выполнение в любой программе для осуществления требуемых манипуляций с изображениями. Это означает, что с библиотекой gd можно связать любую программу на языке C, в которой необходимо использовать код данной библиотеки. Именно такую задачу решили разработчики системы PHP.
В действительности для этой цели был написан набор интерфейсных функций, который позволяет легко вызывать процедуры gd из сценария на языке PHP. Но в самой библиотеке gd нет какого-либо кода, относящегося только к PHP, и разработаны интерфейсы, позволяющие обращаться к этой библиотеке из нескольких других языков программирования и вариантов программной среды, включая Perl, Pascal, Haskell и REXX.
Библиотека gd позволяет вызывать функции для создания исходных изображений (первоначально пустых, напоминающих чистый лист бумаги), чертить и рисовать внутри этих исходных изображений с применением различных способов и в конечном итоге преобразовывать изображение из внутреннего формата изображения gd в стандартный формат изображения, а затем отправлять в окончательное место назначение (выводить в окно браузера либо сохранять в файле или в базе данных). А поскольку все эти операции выполняются под управлением программы, а не осуществляются вручную, то созданные изображения могут становиться сколь угодно сложными и зависеть от любых ситуаций в ходе выполнения программы, от которых желательно сделать их зависимыми.
Форматы изображенийБиблиотека gd в принципе позволяет импортировать и экспортировать изображения с использованием широкой разновидности форматов. Наиболее популярными форматами изображений являются GIF, JPEG и PNG, хотя в основном в рассматриваемых примерах применяется последний из этих форматов.
Форматы GIF и PNG предназначены для описания сетки из цветных элементов, соответствующих пикселям, с учетом некоторых дополнений. Первое дополнение состоит в том, что ячейки могут содержать действительные номера цветов или индексы в таблице с номерами цветов. (Первый вариант позволяет создавать более выразительные изображения, поскольку дает возможность предусматривать любое количество различных цветов, а последний вариант способствует созданию более компактных изображений.)
Второе дополнение заключается в следующем. Безусловно, концептуальное представление форматов GIF и PNG является довольно простым, но на практике чтение, запись и передача изображений в этих форматах всегда осуществляется в сжатой форме. Сжатие необходимо, поскольку для хранения данных, представленных в виде сетки ячеек, требуется большой объем памяти. Простое изображение, состоящее из 500x400 пикселей, включает 200 000 пикселей, причем если для задания каждого пикселя требуются три байта, то объем необходимой памяти уже превышает половину мегабайта.
Тема сжатия является обширной и непростой, но большинство алгоритмов сжатия основано на сокращении избыточности изображения в целях уменьшения его объема. (Например, потребуется меньше места в памяти, если будет указано, что каждый пиксель изображения имеет зеленый цвет, чем задавать значение зеленого цвета отдельно для каждого пикселя.) К сожалению, работа алгоритмов сжатия не сводится к использованию указанных свойств, поскольку при этом приходится решать такие сложные задачи, что способы решения этих задач, реализованные в алгоритме сжатия, применяемого для формирования изображений в формате GIF, были даже запатентованы.
Установка библиотекиОткровенно говоря, задача инсталляции библиотеки gd и обеспечения ее успешной работы в сочетании с системой PHP является довольно сложной. Это обусловлено не какими-либо недостатками программного обеспечения PHP или gd, а полностью определяется проблемами настройки конфигурации; в частности, необходимо разобраться в том, где должны находиться и фактически находятся библиотеки gd, а также проследить за тем, чтобы этапы компиляции и связывания всех исполняемых файлов были выполнены должным образом. Поэтому наилучшей из всех возможных является такая ситуация, когда пользователь обнаруживает, что библиотека gd уже установлена, а в системе PHP уже разрешена поддержка gd (либо благодаря любезности компании, предоставляющей веб-хостинг, либо в связи с тем, что эта библиотека включена в состав инсталлированной системы PHP).
Поэтому инсталляция библиотеки gd должна начинаться с нулевого этапа - с проверки того, не была ли эта библиотека уже установлена. Прежде всего введите в файл сценария приведенный ниже код и рассмотрите результаты его выполнения в браузере, независимо от того, эксплуатируются ли ваши сценарии при поддержке компании веб-хостинга или для этого полностью применяется ваша собственная инсталляция:
После вывода этой страницы на экран достаточно выполнить поиск текстовой строки "gd" в окне браузера. В результате должен быть обнаружен подраздел с описанием того, в какой степени в используемой инсталляции PHP разрешена поддержка библиотеки gd. Если вы намереваетесь лишь подготавливать изображения некоторых типов (например, в формате PNG), а результаты выполнения функции phpinfo() говорят о том, что поддержка изображения этого типа разрешена, то можете сразу же приступать к работе. А если данные о версии gd включают слово "bundled", то применяется библиотека gd, которая входит в комплект поставки PHP.
Если же попытка найти упоминание о библиотеке gd оканчивается неудачей, а инсталляцией PHP занимаетесь вы сами, то можете выполнить инсталляцию и настройку конфигурации библиотеки gd. (С другой стороны, если инсталляцией PHP занимается компания, предоставляющая вам услуги хостинга, то вам остается лишь попросить, чтобы эта компания обеспечила поддержку библиотеки gd, или прибегнуть к услугам другой компании веб-хостинга.)
Использование библиотеки gd, входящий в комплект поставки PHP, позволяет избавиться от многих затруднений, связанных с инсталляцией gd, но не от всех. Дело в том, что применение самой версии, входящей в комплект поставки, позволяет получить библиотеку gd, но не обязательно все библиотеки, необходимые для работы gd. Библиотека gd сама зависит от нескольких других библиотек: libpng (служит для манипулирования изображениями PNG), zlib (используется при сжатии) и jpeg-6b или более поздней версии (предназначена для манипулирования изображениями JPEG, если в этом есть необходимость). Указанные библиотеки уже присутствуют во многих инсталляциях Linux, и в таком случае может оказаться достаточным включить в состав параметров требуемый параметр with (такой как --with-zlib), не указывая инсталляционный каталог. Если настройку конфигурации PHP выполняете вы сами, то достаточно добавить параметр --with-gd, чтобы обеспечить включение в исполняемый файл версии gd, входящей в комплект поставки. А если вы хотите указать на другую версию, то воспользуйтесь вместо этого параметром --with-gd=path.
Если вы обнаружите отсутствие одной или нескольких необходимых библиотек, это будет означать, что эти библиотеки придется сформировать отдельно. Для ознакомления с информацией о том, где найти текущие версии, можно начать с изучения документации, находящейся по адресу www.libgd.org.
Основные принципы работы с библиотекой gdПри создании изображения или манипулирования им с помощью инструментария gd это изображение представлено в специальном формате gd, не имеющим соответствия ни с одним обычным типом изображения. Теоретически возможен экспорт изображений в этом формате gd, но подобная операция применяется редко, поскольку результирующее изображение не является сжатым и не может быть отображено в браузере или в простой графической программе.
Изображение, обрабатываемое с помощью инструментария gd, характеризуется информацией о ширине, высоте и цвете всех пикселей, количество которых равно произведению ширины на высоту. Обычно программа начинает свое взаимодействие с библиотекой gd, либо создавая новое пустое изображение (на котором будет осуществляться черчение и рисование), либо импортируя изображение из файла. На следующих этапах обычно выполняются такие действия: во-первых, распределение цветов в изображении, во-вторых, черчение и рисование или манипулирование изображением с помощью каких-то других операций, в-третьих, преобразование изображения в общепринятый формат (например, PNG или JPEG) и передача его по месту назначения.
Представление цветовДля представления цветов в изображениях gd применяются два способа: представление на основе палитры, которое ограничивается 256 цветами, и представление с реалистичными цветами, позволяющее задавать произвольное количество различных номеров цветов RBG. В версии gd 1.x единственная возможность состояла в использовании цветов на основе палитры, а в библиотеке gd 2.x и в версии этой библиотеки, входящей в комплект поставки PHP, поддерживается возможность создавать и изображения на основе палитры, и изображения в реалистичных цветах. Необходимо учитывать, что каждое конкретное изображение gd должно быть либо основанном на палитре, либо иметь реалистичные цвета (RGB); это означает, что возможность ввести реалистичные цвета в изображения на основе палитры отсутствует.
Чтобы получить исходное пустое изображение на основе палитры, необходимо вызвать функцию ImageCreate() , а дня получения изображения в реалистичных цветах используется функция ImageCreateTrueColor() .
Изображения на основе палитрыЦвета задаются в формате "красный-зеленый-синий" (Red-Green-Blue - RGB), с помощью трех чисел от 0 до 255. Например, цвет, заданный числами (255, 0, 0) является ярко-красным, цвет (0, 255, 0) - зеленый, цвет (0, 0, 255) - синий, цвет (0, 0, 0) - черный, цвет (255, 255, 255) - белый и цвет (127, 127, 127) - серый. Создавая все новые и новые цвета, можно выбирать значения трех цветовых компонентов произвольно.
Любое рисование на изображении должно осуществляться с помощью какого-то конкретного цвета, а цвета должны быть распределены в изображении еще до их использования. Кроме того, первый цвет, распределенный в изображении, автоматически становится цветом фона. Итак, ни в коем случае нельзя считать, что можно обойтись без задания цветов, и обычно операция распределения цветов становится первой операцией после создания нового пустого изображения.
Цвета в изображениях, основанных на палитре, создаются с помощью функции imagecolorallocate(), которая принимает в качестве параметров изображение (созданное ранее) и три целых числа, задающих долю красного, зеленого и синего цветов. Возвращаемым значением является целое число, которое задает индекс нового цвета во внутренней палитре изображения. Это возвращаемое значение необходимо присвоить переменной, поскольку указанное значение индекса необходимо для выполнения всех будущих операций с помощью данного цвета.
Изображения на основе палитры могут иметь максимальное количество цветов, равное 256. (Читателя может интересовать или не интересовать, на чем фактически основаны такие изображения, но каждый пиксель в изображении на основе палитры в действительности представляет собой единственный байт, который хранит индекс одного элемента в палитре из 256 цветов.)
Обратите внимание на то, что индекс, возвращаемый при распределении одного из цветов в некотором изображении, имеет смысл только для этого изображения. Например, если в сценарии PHP переменной $black присваивается цвет, распределенный в одном изображении, то нет смысла использовать эту переменную в качестве входных данных о цвете для команды рисования, вызываемой для обработки другого изображения.
Изображения с реалистичными цветамиВ библиотеке gd 2.0 и в более поздних версиях предусмотрена также возможность создавать изображения, не основанные на палитре, в которых каждый пиксель хранит произвольный номер цвета RGB. В этом так называемом формате с реалистичными цветами количество возможных цветов чрезвычайно велико. Указанная возможность не только беспредельно расширяет рамки художественного самовыражения, но и позволяет достоверно воспроизводить изображения PNG и JPEG с реалистичными цветами, загруженные в память с помощью инструментария gd.
Если не считать того, что для создания первоначального изображения применяется другая функция и отсутствуют ограничения по выбору различных цветов, принципы работы с изображениями с реалистичными цветами аналогичны таковым для изображений на основе палитры.
В частности, для создания новых цветов по-прежнему можно вызывать функцию ImageColorAllocate() и присваивать переменной возвращаемое значение для последующего использования в командах рисования. Единственное отличие состоит в том, что возвращаемым значением является номер цвета RGB, а не индекс элемента в палитре. Кроме того, в изображениях с реалистичными цветами не существует понятия цвета фона, создаваемого в качестве побочного эффекта применения функции ImageColorAllocate(); всем пикселям в результате инициализации присваивается обозначение черного цвета (0, 0, 0).
ПрозрачностьВ версиях gd 2.x поддерживается понятие прозрачности. Для этого используется альфа-канал (задаваемый дополнительно к значениям красного, зеленого и синего цветов), который указывает, насколько прозрачным является данный цвет. Это позволяет, например, накладывать одну форму на другую таким образом, чтобы первая форма оставалась частично видна, а не перекрывалась полностью второй.
В языке PHP многие функции для работы с изображениями имеют аналог, содержащий в имени слово "alpha", которое указывает, что в этих функциях цвет представлен четырьмя значениями (R,G,B,A). Например, функция imageColorAllocate() принимает три параметра, а при вызове функции ImageColorAllocateAlpha() необходимо задать четвертый параметр со значением от 0 до 127. Значение, равное нулю, указывает, что цвет полностью непрозрачен, а значение 127 говорит о том, что цвет полностью прозрачен.
Координаты и команды рисованияПосле создания изображения с помощью инструментария gd неявно образуется система координат, позволяющая задавать в ее рамках команды рисования. Предельные значения координат в этой системе определяются заданными параметрами ширины и высоты изображения.
Начало координат в данной системе, соответствующее координатам (0, 0), находится в верхнем левом углу изображения. Положительным направлением для значений X является направление слева направо, а для значений Y - сверху вниз. (В системах координат компьютерной графики такое местонахождение начала координат встречается часто, но те, кто изучал аналитическую геометрию, по-видимому, привыкли к тому, что начало координат находится в левом нижнем углу диаграммы.)
Количество команд рисования очень велико. Эти команды включают, но не ограничиваются командами черчения отрезков линии, прямоугольников и дуг, а также командами задания значений конкретных пикселей. Но следует учитывать, что конечным результатом всех этих команд рисования и черчения становится задание значений пикселей. После выполнения команд, изменяющих значения пикселей, в памяти не остается каких-либо следов (кроме самих изменившихся значений), поэтому отсутствует способ, позволяющий отменять действие команд рисования и черчения или раздельно представлять результаты различных команд.
Ничто не препятствует применению команд рисования, действие которых выходит за пределы указанного изображения, но такое рисование не оказывает видимого эффекта. Например, на изображении не будет виден прямоугольник, все значения координат которого являются отрицательными.
Преобразование форматовВсе операции рисования и манипулированием изображением выполняются над изображением, представленным во внутреннем формате gd. А после завершения этих операций в сценарии может быть вызвана одна из команд преобразования и вывода (imagepng, imagetjpeg и т.д.) для преобразования этого изображения в требуемый графический формат и вывода его в окно браузера пользователя (или в файл).
Освобождение ресурсовПосле того как результат преобразования законченного изображения gd передан пользователю, можно считать, что работа с внутренней версией закончена. Это означает, что данная версия должна быть уничтожена. Правильный способ выполнения подобной операции состоит в вызове функции imagedestroy() с указанием изображения в качестве параметра.
Функции библиотеки gdМы не собираемся отдельно перечислять и описывать в данной статье все функции, предусмотренные в интерфейсе gd интерпретатора PHP. Для ознакомления с этой информацией рекомендуем воспользоваться разделом "Обработка и генерация изображений" руководства php.net. Большинство из функции gd относятся к одной из категорий, приведенных в таблице ниже. Обратите внимание на то, что в именах функций, перечисленных в этой таблице, для удобства чтения первая буква каждого слова представлена в верхнем регистре, но это условие в примерах кода не всегда соблюдается, поскольку имена функций PHP не чувствительны к регистру:
Классификация функций gd| Функции создания изображения | ImageCreate(), ImageCreateTruecolor(), ImageCreateFromGd(), ImageCreateFromJpeg() | Возвращают новое изображение gd. Функция ImageCreate() принимает в качестве параметров значения ширины и высоты изображения, а параметрами других функций являются путь к файлу, URL или строка, содержащая ранее созданное изображение, которое должно быть загружено и преобразовано в формат gd |
| Функции, выполняющие операции распределения цветов | ImageColorAllocate(), ImageColorAllocateAlpha(), ImageColorDeallocate() | Функция ImageColorAllocate() принимает в качестве параметров дескриптор изображения и требуемые значения красного, зеленого и синего цветов, после чего возвращает номер цвета, предназначенный в дальнейшем для использования в операциях рисования и черчения. Функция ImageColorAllocateAlpha принимает дополнительный параметр-коэффициент прозрачности (0-127) |
| Функции, выполняющие операции согласования цветов | ImageColorClosest(), ImageColorClosestAlpha(), ImageColorExact(), ImageColorExactAlpha() | Возвращают индекс согласующегося цвета в изображении с палитрой. Функции, содержащие в своем имени слово "Closest", возвращают наиболее точно согласующийся цвет (точность согласования измеряется как расстояние между точками в пространстве значений RGB); функции с обозначением "Exact" возвращают номер цвета, только если он идентичен искомому, в противном случае возвращают значение -1, функции с именем "Alpha" оперируют цветами, для определения которых применяются четыре значения (с прозрачными цветами) |
| Функции вычерчивания линий | ImageLine(), ImageDashedLine(), ImageRectangle(), ImagePolygon(), ImageEllipse(), ImageArc() | Применяются для вычерчивания отрезков прямых или кривых указанной формы. Обычно первым параметром каждой из этих функций является изображение, последним параметром - цвет, промежуточными параметрами - координаты X и Y |
| Функции установки пера для вычерчивания линий | ImageSetStyle(), ImageSetThickness() | Изменяют параметры настройки, которые влияют на характеристики линий, создаваемых последующими командами вычерчивания линий (некоторые из этих функций применимы только в версии gd 2.0.1 или более поздних версиях) |
| Функции рисования и заливки | ImageFilledRectangle(), ImageFilledEllipse(), ImageFilledPolygon(), ImageFilledArc(), ImageFill() | Как правило, аналогичны соответствующим функциям вычерчивания линий, но предусматривают не только вычерчивание контуров областей, а заполнение создаваемых областей цветом. Специальная функция ImageFill() выполняет операцию заполнения заливкой, для который применяется указанный цвет заливки. Заливка осуществляется во всех направлениях, начиная с указанной точки с координатами XY (для выполнения некоторых из этих функций требуется версия gd 2.0.1 или более поздняя) |
| Функции для работы с текстом | ImageString(), ImageLoadFont() | Функция ImageString принимает в качестве параметров дескриптор изображения, номер шрифта, координаты X и Y, строку текста и цвет. Если номер шрифта находится в пределах между 1 и 5, то для вывода строки в данном цвете используется один из пяти встроенных шрифтов. С другой стороны, номер шрифта больше 5 указывает на результат загрузки специализированного шрифта с помощью функции ImageLoadFont() |
| Функции экспорта | ImagePng(), ImageJpeg() | Преобразовывают внутреннее изображение gd в изображение соответствующего формата, а затем отправляют это изображение в выходной поток. Если задан только один параметр (дескриптор изображения), то выполняется эхо-повтор изображения для пользователя, а при использовании дополнительного параметра, представляющего собой путь к файлу, адресом назначения выходного потока становится файл |
| Функция уничтожения изображения | ImageDestroy() | Принимает в качестве параметра дескриптор изображения и освобождает все ресурсы, связанные с изображением |
Для того чтобы изображение могло быть представлено должным образом в браузере пользователя, необходимо указать, откуда должно поступить изображение и каков его формат. Поэтому, к сожалению, невозможно просто внедрить, например, вызов функции imageToPng() в создаваемый файл HTML и тем самым решить задачу вывода изображения. По сути, приходится чередовать код вывода изображений с кодом HTML, формируемым в сценарии PHP, и для этого можно воспользоваться одним из трех описанных ниже вариантов.
Создание полностраничных изображенийВ виде изображения может быть оформлена вся формируемая страница. В этом случае необходимо передать заголовок HTTP, предшествующий данным изображения, и тем самым объявить, что дальше следует изображение определенного типа. Например, в конце сценария могут быть предусмотрены такие строки:
// ... код, в котором создается изображение и присваивается // переменной $image header("Content-type: image/png"); // Вывести заголовок в браузер imagepng($image); // Передать данные самого изображения, преобразованного в формат PNG imagedestroy($image); // Освободить ресурсы
Преимущество данного подхода состоит в том, что для передачи указаний о составе будущего изображения можно применять любую информацию, включая параметры POST. А его недостаток заключается в том, что результирующая страница не может содержать какого-либо обычного кода HTML. В действительности приходится даже следить за тем, чтобы перед заголовком и изображением в сценариях не передавался какой-либо текстовый вывод, поскольку такая ситуация равносильна преждевременной отправке информационного наполнения. В этом случае появляется сообщение об ошибке "Headers already sent...".
Внедрение изображений, хранящихся в файлахПрежде всего отметим, что в языке HTML поддерживается дескриптор , который позволяет внедрить изображение, указывая путь к файлу изображения или URL, как в следующем примере:
Данная конструкция применяется к статическим файлам изображения, но нет причин, по которым нельзя было бы обеспечить с ее помощью внедрение вновь созданного изображения. Поэтому можно подготовить такой сценарий, в котором вначале создается изображение, затем данные изображения записываются в локальный файл, после чего вырабатывается код HTML с соответствующим дескриптором , указывающим на только что созданный файл.
Единственными недостатками этого подхода является то, что, во-первых, в процесс создания страницы приходится включать операции записи файлов, которые могут потребовать много времени, и, во-вторых, нужно определить, что делать с файлами по окончании их использования.
Но в определенной ситуации данный подход является идеальным. Речь идет о создании и кэшировании изображений, представляющих конечное множество вариантов выбора. В этом случае предусматривается определенный способ связывания той или иной ситуации с именем файла изображения. При возникновении некоторой из подобных ситуаций, требующей вывода изображения, проверяется, имеется ли уже соответствующий файл. В случае положительного ответа просто применяется ссылка на этот файл, оформленная в виде дескриптора , а если ответ отрицателен, то создается изображение, записывается в файл, а затем опять-таки применяется ссылка на это изображение. В конечном итоге формирование новых файлов просто не потребуется.
Наконец, нет таких причин, по которым нельзя было бы предусмотреть автономный сценарий формирования изображения, а затем внедрять полученное изображение в динамическую страницу, создаваемую с помощью другого сценария, задавая в дескрипторе URL этого сценария. При этом единственная сложность состоит в выборе способа передачи необходимых данных на зависимую страницу. Например, дескриптор с указанием внедренного изображения может иметь такой вид:
В этом случае сценарий ballpage.php возвращает изображения PNG цветных шаров, находящихся в различных позициях рисунка.
Но при использовании указанного подхода могут возникать нарушения в работе, поскольку веб-серверы и браузеры иногда проверяют суффиксы обрабатываемых файлов и, получив результаты проверки, реагируют на них по-разному. Например, сценарию формирования изображения ballpage может потребоваться присвоить расширение.php для того, чтобы сервер Apache мог определить, что данный серверный код должен интерпретироваться как код PHP (хотя необходимый режим обработки может быть задан и с помощью файлов конфигурации).
Тем не менее есть и такие нестандартные версии браузеров, в которых не учитывается возможность того, что файл с расширением.php формирует изображение, даже несмотря на то, что передаваемый заголовок указывает, что далее следует изображение. Поэтому при использовании указанного метода необходимо проверить сценарии в разных браузерах и убедиться в том, что намеченный круг пользователей будет получать страницы в таком виде, какой был вами задуман.
Ниже рассматриваются примеры применения библиотеки gd для создания изображений.
Пример использования библиотеки gd: создание простых фигурВ следующем примере мы покажем как с использованием библиотеки gd сгенерировать рисунок содержащий простые геометрические фигуры:
Что мы изменили?
- Теперь поскольку у нас в наличии имеется несколько видов диаграмм, через $_GET нам будет передаваться тип диаграммы. То же самое и с $Month и $Hour и $Year;
- Далее мы создаём массив $MonthNames, который будет содержать названия месяцев. Поскольку массив начинается с нуля, то первый элемент равен null;
- Теперь в зависимости от типа переменные $Query, $ResultArray, $ChartHeading и $XAsixName присваиваются в switch. Если $Type не установлен, то по умолчанию будут отображаться месяца;
- Далее мы подключаемся к базе, выполняем запрос, копим результат в массив и генерируем первую часть xml файла;
- Далее генерируем тело XML файла. Поскольку тело зависит от типа диаграммы, мы снова используем switch;
- Месяца: всё то же самое за исключением ссылки. Теперь она будет такой: newchart-xmlurl-get-data.php; newchart - говорит о том, что мы создаём новую диаграмму, xmlurl - по какому адресу искать данные. Всё что идёт далее является частью URL. Вот полная ссылка к месяцу Январь: newchart-xmlurl-get-data.php?type=hourly&Year=2010&Month=1
- Дни: всё тоже самое и в случае с месяцем, только вот URL теперь содержит информацию, касающуюся дней;
- Часы: если мы не хотим, чтобы после этой диаграммы следовали другие, просто не установим ей URL;
- В самом конце закрываем XML;
Сохраните данный файл как get-data.php; Теперь откройте браузер и проверьте работу скрипта. Например: http://localhost/fcdemo/get-data.php?year=2010
Вы должны увидеть что-то вроде этого:
Тестируйте
Теперь мы полностью закончили работу над диаграммами. Для того, что проверить работу зайдите по адресу http://localhost/fcdemo/demo.html
Если вы всё правильно сделали, то на странице увидите Column3D диаграмму. Если вы кликните по одному из столбцов, то откроется новая диаграмма. И так далее…
Если вы внимательно изучили данный урок, то уже скорее всего имеете общее представление о связных диаграммах на PHP/MySQL. Точно такие же диаграммы могут быть сделаны для следующей статистики:
- Количество продаж за период времени;
- Сколько раз ваш сайт переставал работать;
- Количество посетителей отдельной страницы;
Структура диаграммы будет одна и та же для любой темы. Используйте какой-то параметр для выборки инфы из базы, затем превратите ответ в XML и всё, диаграмма готова!
Для большего вдохновения можете посетить вот эту демо страницу. Спасибо за внимание!
