JavaScript решения для построения графиков

27 октября 2008, 9:17 Павел Марковнин JavaScript рейтинг +21-

графики JavaScriptКогда-то давно мы уже писали о различных решениях для построения графиков на сайтах. В тот раз это были в основном flash решения.

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

Итак, давайте рассмотрим 8 отличных скриптов JavaScript для построения графиков.

Raphaël

Raphael

Для работы библиотека использует SVG/VML. Работает в Firefox 3.0+, Safari 3.0+, Opera 9.5+ и Internet Explorer 6.0+.

Flot

Flot

 

Библиотека Flot постоена на jQuery и разработана в IOLA. Легкая в использовании, она имеет несколько дополнительных функций, таких как увеличение при помощи мыши (кликните и тащите нужную область) и возможность определения координат клика.

Flotr

Flotr

Flotr, написанная Басом Веннекером из Solutoire.com, это скрипт для графиков, идея которого была взята из Flot. Это решение основано на Prototype и использует excanvas.js. Поддерживаются многие современные браузеры, в том числе Internet Explorer 6.

fgCharting плагин для jQuery

fgCharting jQuery

fgCharting это плагин jQuery. Его отличительной особенностью является то, что он строит графики, вытаскивая данные из HTML таблицы. Самый простой вариант использования предпологает только одну строчку кода.

PlotKit

PlotKit

PlotKit основан на Mochikit и является рерайтом проекта CanvasGraph.js. Библиотка имеет поддержку SVG.

Диаграммы на JavaScript

JavaScript Diagram Builder

Поддерживает несколько типов диаграмм, в том числе столбцы, точки, линии и прочее.

Emprise JavaScript Charts

Emprise JavaScript Charts

Движок для графиков под Dojo

The Dojo Charting Engine

dojo, javascript, jquery, prototype, графики.
Memori.ru mister-wong.com bobrdobr.ru moemesto.ru del.icio.us zakladki.yandex.ru google.com/bookmarks/

Автор статьи: Павел Марковнин

Понаписал еще 106 статей.

Рекламное место, которое может стать вашим

Понравилась статья?

Тогда подпишись на обновления через RSS или воспользуйся
другими способами подписки.

Читать в Яндекс.Ленте Добавить в Google Добавить в Netvibes
  •  

Теоретически похожие статьи

Также обратите внимание на другие статьи раздела «JavaScript».

Комментарии — 17

RSS
  • Аватарка
    27 октября 2008 в 10:49 ]]>GIN]]>
    Спасибо за подборку. Flotr симпотичные графики строит. А кстати из php решений для рисования графиков лично мне очень нравится pChart.
  • Аватарка
    27 октября 2008 в 15:46 ]]>Zodios]]>
    Спасибо за интересный обзор, правда не хватает информации по поддержке форматов импорта и платностибесплатности библиотеке и какие ограничения накладываются.
  • Аватарка
    28 октября 2008 в 18:55 ]]>cody]]>
    Понравился flot, возможность выделять точки на графике, отлавливать события.
  • Аватарка
    31 октября 2008 в 8:50 Андрей [Sam] Несвой
    То что надо. Исправьте опечатку в названии статьи "для постоения графиков".
  • Аватарка
    31 октября 2008 в 11:00 Big_Shark
    Есть еще бесплатное api от google для построения графиков!
  • Аватарка
    1 ноября 2008 в 17:43 Михаил
    Спасибо, давно искал!
  • Аватарка
    3 ноября 2008 в 9:58 Rodriguez
    Спасибо за подборку!
  • Аватарка
    12 ноября 2008 в 10:27 Сергей
    SVG рулит, такими темпами в скором времени можно будет позабыть про Flash, но.. не работает в ИЕ6
  • Аватарка
    12 ноября 2008 в 17:34 doubled
    А есть скрипты или flash для построения графов? :)
  • Аватарка
    12 ноября 2008 в 19:16 ]]>Grin]]>
    doubled, скорее всего есть, просто нужно знать более четкие требования и искать решения уже под них
  • Аватарка
    12 ноября 2008 в 19:17 ]]>Grin]]>
    Сергей, есть такая библиотека Рафаэль, которая позволяет использовать вектор на вебе (в осле тоже)
  • Аватарка
    13 ноября 2008 в 22:44 Сергей
    Насколько известно мне, формат SVG IE6 не поддерживает. Однако да, есть ещё и формат VML который подружился с ИЕ больше чем SVG. И он действительно реализован в рафаэле, но удобнее и проще работать всё таки с VML. Ещё один повод перейти на FF тем кто этого ещё не сделал)
  • Аватарка
    13 ноября 2008 в 22:45 Сергей
    правлюсь) удобней конечно же с SVG)
  • Аватарка
    20 ноября 2008 в 12:38 ]]>mizhgan]]>
    Спасибо за обзор, как раз искал нечто подобное. И повторю вопрос о библиотеках, отрисовывающих графы. Очень необходима такая штука, для отрисовки ненаправленных графов на плоскости. Желательно в эстетически удобоваримом виде =) Может кто либо озадачивался подобным и что-то уже нашел, поделитесь.
  • Аватарка
    12 апреля 2009 в 16:41 ]]>ANDRU]]>
    Еще бы инструкции по работе с ними на русском найти
  • Аватарка
    10 мая 2009 в 22:52 ]]>ilya_compman]]>
    А почему никто не вспомнил про API Google Chart? ;)
  • Аватарка
    10 мая 2009 в 22:54 ]]>Grin]]>
    Так мы про это говорили в прошлой статье ;-)
  • Эл. почта (используется для Граватарки)
  • Домашняя страница
  • Имя в Твиттере
  • Разрешенные теги Текст сообщения (надо бы заполнить это поле)
  • как выглядит какой тег
    жирный текст <b>жирный текст</b>
    курсивный тект <i>курсивный тект</i>
    зачеркнутый текст <s>зачеркнутый текст</s>
    подчеркнутый текст <u>подчеркнутый текст</u>
    ссылка <a href="адрес">ссылка</a> 
    function foo() { ... }
    		 <pre><code>function foo() { ... } </code></pre>