Cyrill

В предыдущей записи я начал обзор средств построения графиков для веб. Там речь шла о разнообразных flash-компонентах, позволяющих визуализировать ваши данные. Пришло время продолжить – сегодня вашему вниманию 16 средств для построения графиков при помощи CSS/AJAX/Javascript. Никаких серверных скриптов и никакого flash – только javscript, CSS и динамический HTML. Этот обзор дополняет предыдущий, завершая тем самым мини-цикл, посвященный построению client-side графиков и диаграмм.

1. PlotKit - Javascript Chart Plotting

PlotKit – свободно распространяемый скрипт, основанный на Mochikit и предназначенный для отрисовки разнообразных диаграмм. Существует два режима работы:

• при помощи html-объекта canvas с поддержкой браузеров Safari 2+, Opera 9+, Firefox 1.5+ и IE 6 в режиме эмуляции canvas
• SVG (в Opera 9+, Firefox 1.5+ с ограничениями и IE6 с поддержкой Adobe SVG)

2. Plotr

Легкий (12Кб) свободно распространяемый скрипт, основанный на предыдущем – PlotKit. Не требует наличи MochiKit, ради чего, собственно, и задумывался (правда, добавился Prototype :-)). В отличие от PlotKit, использует только html canvas. Декларируется работа в следующих браузерах: Firefox 1.5+, Safari 2.0+, Opera 9.0+ и IE6+ в режиме эмуляции html canvas.

3. Flot

Свободно распространяемый плагин для jQuery, предназначенный для построения графиков из различных наборов данных на лету на стороне клиента. Фишка – в простоте использования (все настройки являются опциональными), привлекательном внешнем виде и интерактивных примочках, типа увеличения на лету. Несмотря на простоту в использовании, Flot достаточно продвинут для работы в сложных Web2.0 приложениях.

Плагин должен работать на всех свежих браузерах, отрисовка производится при помощи тега canvas везде, кроме IE. Там используется javascript-эмуляция – excanvas.

Под катом - еще 13 javascript-графиков.
Читать полностью »

Если вы занимаетесь разработкой интерфейсов, то наверняка сталкивались с необходимостью разместить на страницах вашего проекта график или диаграмму того или иного содержания и вида: в одном случае это мог быть график суточного отсева спам-сообщений, в другом – “живая” диаграмма, отображающая количество комментариев к вашей статье.

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

Однако, ситуация меняется к лучшему, о чем я и решил написать. Итак, flash-средства построения графиков, чартов и диаграмм для веб. Они имеют единственный, правда весьма заметный недостаток – если у посетителя отключен флэш, он ничего не увидит. Если вы хотите подстраховаться - было бы неплохо проверять наличие включенного flash и отдавать либо статические графики, либо предупреждение о том, что нужно включить отображение flash.

Кстати, я установил Snap – стало ли от этого удобнее?

1. FusionCharts Free

Мощное и достаточно распространенное бесплатное средство для построения 22 типов графиков и диаграмм на страницах вашего сайта или интранета. Предлагается обертка для упрощения построения графиков на PHP. На сайте производителя существует шикарная документация с примерами использования для различных языков программирования и статического XML.

Для тех, кому всегда мало – имеется коммерческая версия FusionCharts, предлагающая дополнительные опции визуализации типа трехмерного освещения, еще 23 типа графиков и, как уверяет разработчик, полную поддержку AJAX/Javascript. Цены - от 69 до 4500 долларов.

Кроме бесплатного решения для разработчиков, FusionCharts предлагает воспользоваться своим компонентом в виде Google Gadget -визуального конструктора, позволяющего создать график и получить код для его размещения на страницах вашего сайта.

2. amCharts

Еще одно средство построения анимированных графиков на flash. Умеет строить кольцевые диаграммы, классические графики X-Y и многое другое. На сайте и в блоге разработчика приводятся образцы использования и документация. Имеется форум технической поддержки.

Существует бесплатная версия, с единственным ограничением – все графики будут содержать ссылку на сайт разработчика. Цена коммерческой версии начинается на уровне €85 за лицензию на использование в пределах одного домена.

3. AnyChart Flash Chart Component

Исключительно коммерческий и весьма недешевый (от $499 за лицензию на одного разработчика) flash-компонент для построения анимированных диаграмм. Предлагается более 60 типов графиков и ряд интересных опций – например, возможность сохранить график как картинку.После регистрации на сайте становится доступна пробная версия компонента.

Под катом - еще восемь flash-компонентов для построения графиков.

Читать полностью »