Dc.js piechart legend overflowing

Im, использующий dc.js, чтобы отображать среди других вещей пироги, которые имеют легенду. Однако, когда в piechart содержится много данных, все предметы легенды не подходят, и они просто скрыты. Я могу сказать, что они отображаются, если я проверяю DOM.Dc.js piechart legend overflowing

Скриншот моей проблемы:

Я попытался просто добавить overflow:scroll; к <g class="dc-legend"> элемент, который содержит все элементы легенды. Но это не работает с момента его svg.

Я пробовал искать для этого, но не пришел к решению. Я знаю, что в диаграммах есть возможность разбивать ярлыки на ярлыки.

Как решить эту проблему в dc.js?

источник

2016-05-26 Erik Svedin

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

Вы пытались сделать контейнер более широким? Вы можете использовать функцию .svg, которая вернет верхний элемент svg для диаграммы, там вы можете установить желаемую ширину. Больше информации here.

EDIT:

Или вы можете установить фиксированную ширину и высоту в DIV, содержащий ваш график и сделать SVG как большой, как вы хотите, чтобы метки показать. А затем сделайте div прокручиваемым.

Проверить этот ответ для получения дополнительной информации: How to get ScrollBars in SVG?

источник

2016-05-26 09:16:31 torresomar

Ну, я могу сделать контейнер выше, однако это испортит мой макет довольно плохо, как вы можете сказать по ширине среза пейчарта. Есть много разных предметов легенды, которые нужно визуализировать. У меня скорее есть фиксированная ширина легенды рядом с моей круговой диаграммой и сделайте контейнер прокручиваемым/разбитым на страницы –

, чтобы ответить на отредактированный ответ: Теперь мы куда-то попадаем. Однако есть еще проблема, так как это означало бы, что фактическая круговая диаграмма будет прокручена и вне поля зрения. Только легенда должна прокручиваться. –

Ну, они используют d3 за кулисами, вы, вероятно, должны проверить, можете ли вы сделать что-то, чтобы визуализировать метки в другом контейнере. По моему опыту, это бремя использования библиотек поверх других, вы можете получить результат довольно быстро, но настройка будет болью :( – torresomar

Dc.js piechart legend overflowing

ответ

Смежные вопросы