Используя диаграмму. js, как мне выровнять столбцы вместо их центрирования, когда для отображения всего несколько столбцов? - PullRequest
1 голос
/ 28 мая 2020

В качестве фона: у меня есть горизонтальная гистограмма с динамическим c количеством столбцов. Я установил минимальную и максимальную ширину полос для каждого набора данных.


По умолчанию диаграмма. js выравнивает полосы по центру диаграммы. Вместо этого я хотел бы выровнять столбцы по левому краю (или вверху, поскольку я использую горизонтальную гистограмму).

Если рассматривать столбцы как элементы HTML, это было бы эквивалентом применения css: float:left для каждого бара. Есть ли способ сделать это в диаграмме. js? Я все еще хочу, чтобы оси доходили до конца контейнера, просто забавно иметь только пару стержней с тонной пространства между ними (я также не хочу, чтобы действительно жирные стержни).

Спасибо за любую помощь!


Примечание: это дубликат 56361398


EDIT : См., Например, codepen (одна полоса находится в центре диаграммы, я бы хотел, чтобы она выровнялась по левому краю, рядом с осью y).

1 Ответ

0 голосов
/ 03 июня 2020

Я проверил настройки, но нет настройки для выравнивания гистограмм по левому краю. Я сомневаюсь, что это легко реализовать, поскольку Chart. JS - это canvas под капотом.

Кроме того, технически говоря, диаграмма фактически выровнена по левому краю, но это всего лишь одна тонкая полоса. Полоса вполне могла бы использовать всю полоску красного цвета: enter image description here

Лучшее решение - создать пустой labels, который позже будет заполнен при необходимости. enter image description here Если вам нужно добавить больше полос, просто проверьте, является ли имя метки "" (пусто), а затем перезапишите его. В противном случае push новая метка.

Пример: https://codepen.io/adelriosantiago/pen/vYLYXPx?editors=0110

...