Я хочу создать круговую диаграмму в JavaScript. При поиске я нашел API графиков Google. Поскольку мы используем jQuery, я обнаружил, что существует интеграция jQuery для графиков Google.
Но моя проблема заключается в том, что фактические данные отправляются на сервер Google для создания диаграмм. Есть ли способ предотвратить отправку данных в Google? Меня беспокоит отправка моих данных третьему лицу.
jqPlot выглядит неплохо, и это с открытым исходным кодом.
Вот ссылка на самые впечатляющие и обновленные примеры jqPlot.
С точки зрения взаимодействия, Флот, безусловно, приблизит вас к графике Flash, как можно ближе к jQuery. Несмотря на то, что вывод графика довольно гладкий и великолепно выглядящий, вы также можете взаимодействовать с точками данных. Я имею в виду, что вы можете иметь возможность навести курсор на точку данных и получить визуальную обратную связь от значения этой точки на графике.
Версия trunk для флота поддерживает круговые диаграммы.
Возможность масштабирования флота.
Кроме того, у вас также есть возможность выбрать фрагмент графика, чтобы вернуть данные для определенной "зоны". В качестве дополнительной функции для этого "зонирования" вы также можете выбрать область на графике и увеличить масштаб, чтобы увидеть точки данных немного ближе. Очень круто.
Sparklines - мой любимый мини-графический инструмент. Действительно отлично подходит для графиков стиля панели инструментов (подумайте о панели инструментов Google Analytics при следующем входе в систему). Поскольку theyre настолько крошечный, они могут быть включены в строку (как в примере выше). Еще одна приятная идея, которая может использоваться во всех графических плагинах, - это возможности самообновления. Их демо-версия Mouse-Speed показывает вам мощь живого графика в лучшем виде.
Диаграмма jQuery 0.21 - это не самый красивый плагин для построения диаграмм, там он должен быть указан. Его довольно простой в функциональности, когда дело доходит до графиков, которые он может обрабатывать, однако он может быть гибким, если вы можете потратить некоторое время и усилия на него.
Добавление значений в диаграмму относительно просто:
.chartAdd({
"label" : "Leads",
"type" : "Line",
"color" : "#008800",
"values" : ["100","124","222","44","123","23","99"]
});
jQchart является нечетным, они встроены в анимационные транзисторы и функции перетаскивания в диаграмму, однако его немного неуклюжие - и, казалось бы, бессмысленные. Он генерирует красивые диаграммы, если вы правильно настроите CSS, но там лучше.
Tuftegraph продает себя как "красивые гистограммы, которые вы покажете своей матери". Он приближается, Флот красивее, но Tufte делает себя очень легким. Хотя с этим и заканчиваются ограничения - есть несколько вариантов выбора, так что вы получаете то, что вы указали. Посмотрите на карту быстрого выигрыша.
В поле появился новый игрок, предлагающий передовые интерактивные графики HTMl5:
http://datavisualizationsoftwarelab.com/en/products/pie-chart/
Пример диаграмм:
Документация: http://developers.dvsl.co/en/pie-chart/
Что круто об этом lib:
Графики бесплатно для некоммерческого использования, коммерческие лицензии и техническая поддержка также доступны.
Также вам помогут интерактивные временные диаграммы и чистые диаграммы.
Графики поставляются с обширными API и настройками, поэтому вы можете контролировать каждый аспект диаграмм.
Тонны замечательных предложений здесь, просто собираются бросить ZingChart в стек для хорошей оценки. Недавно мы выпустили обертка jQuery для библиотеки, которая упрощает сбор и настройку диаграмм. Ссылки CDN находятся в демо ниже.
Я нахожусь в команде ZingChart, и мы здесь, чтобы ответить на любые вопросы, которые могут возникнуть у вас!
$('#pie-chart').zingchart({
"data": {
"type": "pie",
"legend": {},
"series": [{
"values": [5]
}, {
"values": [10]
}, {
"values": [15]
}]
}
});<script src="http://cdn.zingchart.com/zingchart.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.zingchart.com/zingchart.jquery.min.js"></script>
<div id="pie-chart"></div>Несколько других, которые не были упомянуты:
Для мини-пирогов, линий и баров Peity является блестящим, простым, крошечным, быстрым, использует действительно элегантную разметку.
Я не уверен в этом отношении с Flot (учитывая его название), но Flotr2 довольно неплохо, конечно, лучше делает пироги чем Флот.
Bluff создает красивые графические диаграммы, но у меня были проблемы со своими пирогами.
Не то, что мне было, но еще один коммерческий продукт (как и Highcharts) - TeeChart.
Chart.js весьма полезен, поддерживая также множество других типов диаграмм.
Он может использоваться как с jQuery, так и без него.
Бесплатно для некоммерческого использования.
Включает плагины для jQuery, Node.js, WordPress, Drupal, Joomla, Microsoft TypeScript и т.д.
Некоторые скриншоты некоторых демонстраций:
