Графическая библиотека JavaScript

Я создаю веб-приложение в Google App Engine для удовольствия, и я хотел бы включить графики, чтобы пользователи могли видеть некоторые статистические данные. Есть ли свободные (как в пивной, так и речевой) библиотеки JavaScript, которые могут взять таблицу или сделать какой-либо вызов AJAX и отобразить график?

Ответ 1

Flot может создавать некоторые действительно красивые диаграммы. Это библиотека JavaScript, а не такая служба, как Google Charts. Это действительно требует jQuery.

Ответ 2

Вот мой личный список с комментариями:

Flot: + красивые пресеты + очень просты в использовании (наиболее тяжело было преобразовать даты ISO в даты Javascript, что совсем не сложно) + использует jQuery - не делает круговые диаграммы, выглядит немного заброшенным, но Я мог ошибаться в этом.
Flotr: ++ даже более симпатичные диаграммы, чем Flot + -use Prototype (с которым я никогда не работал), -no круговые диаграммы
YUI: + круговые диаграммы! + поддержка и сильные команды и сообщества. Flash, ugh-не обрабатывает оси времени так же хорошо, как Flot.
API диаграмм Google (а не JS-библиотека): + поддержка и сообщество + симпатичная, слишком утомительная конструкция URL-адресов REST для любого более сложного графика - автоматическая поддержка даты и времени

Вкратце, для крошечных простых графиков я бы использовал API диаграмм Google, но для моего текущего проекта (внутреннего средства отчетности) это, скорее всего, Flot, хотя если бы это был код, обращенный к клиенту, я бы вероятно, либо посмотрите дальше, либо попробуйте Flotr/Prototype.

Ответ 3

Отъезд Диаграммы Google

Ответ 4

Theres API визуализации Google,

Он позволяет создавать легкие диаграммы/таблицы (некоторые из них даже интерактивны) почти что угодно в javascript

google.load("visualization", "1", {packages:["areachart"]});
  google.setOnLoadCallback(drawChart);
  function drawChart() {
    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addRows(2);
    data.setValue(0, 0, '2004');
    data.setValue(0, 1, 1000);
    data.setValue(0, 2, 400);
    data.setValue(1, 0, '2005');
    data.setValue(1, 1, 1170);
    data.setValue(1, 2, 460);
    var chart = new google.visualization.AreaChart(document.getElementById('chart_div'));
    chart.draw(data, {width: 400, height: 240, legend: 'bottom', title: 'Company Performance'});
  }

Вот несколько примеров из галереи доступных в настоящее время галерей google.

http://code.google.com/apis/visualization/documentation/gallery/images/icon-areachart.png http://code.google.com/apis/visualization/documentation/gallery/images/icon-areachart.png http://code.google.com/apis/visualization/documentation/gallery/images/icon-barchart.png alt text http://code.google.com/apis/visualization/documentation/gallery/images/icon-gauge.png alt text http://code.google.com/apis/visualization/documentation/gallery/images/icon-piechart.png p >