2014-09-25 3 views
5

Я использую Charts.js - очевидно, для создания диаграмм.Создание расширения горизонтальной диаграммы диаграммы на Chart.js

Я хочу иметь горизонтальную гистограмму в моем приложении, но мне кажется, что Chart.js не имеет его, поэтому я обратился к вилке этого репо под названием Однако ChartNew.js.

ChartNew.js совсем не реагирует , и то, что привлекло меня больше всего до Chart.js, - это способность иметь гибкие диаграммы.

Я знаю, что Charts.js разрешает easy extension или «взломать» существующих объектов диаграммы.

Можно ли "регулярная гистограмма extend' Chart.js в становится горизонтальной гистограммой?

+0

Предпочитаете ли вы использовать другие графические библиотеки, кроме Chart.js? –

+0

Это был бы последний вариант. Я предпочитаю иметь единую эстетику между графиками, используя одну библиотеку для экономии по размеру, читаемость кода и ... ну, простоту. Если можно просто расширить Chart.js, это было бы идеальным –

+0

Для горизонтальных диаграмм и использования альтернативного программного обеспечения, что вы имели в виду? У меня такая же проблема и я не хочу расширять ChartJS – Radek

ответ

13

Chart.js не приходит с горизонтальной гистограммы по умолчанию.

Однако он построен в очень модульной форме. Это позволяет разрабатывать сторонние плагины, которые не вступают в конфликт с основным кодом.

Поскольку мне нужны горизонтальные гистограммы для проекта, над которым я работал, я взял на себя смелость создать тот, который вы можете найти здесь.

https://github.com/tomsouthall/Chart.HorizontalBar.js

Вы можете установить его с помощью беседки:

$ bower install chart.horizontalbar 

Синтаксиса для создания диаграммы точно так же, как и для создания стандарта (вертикальная) гистограммы:

var myChart = new Chart(ctx).HorizontalBar(data, options); 

Это довольно быстро взломанный проект, но он отлично поработал над тем, что мне нужно! Надеюсь, поможет.

+0

Сэр есть ли способ установить ширину бары? –

+0

Это работает очень хорошо, но анимация немного странная при использовании штабелированных баров. Каждый бар оживляет синхронно друг с другом. Есть ли способ сделать последующие штрихи рисовать после того, как левые большинство баров уже нарисованы, как будто это один бар, который оживляет. Я пытался это решить, но мои глаза начинают перебирать в ней главную роль. – WebWanderer

5

Я знаю, что это может быть не полезным для вас, но может помочь кому-то еще, Google карты действительно хорошо взглянуть на это https://developers.google.com/chart/

+0

спасибо, я не знал, что –

+0

это действительно замечательная и простая в использовании самая лучшая часть, она полностью настраивается в соответствии с нашими потребностями –