graphieros / vue-data-ui

A user-empowering data visualization Vue 3 components library for eloquent data storytelling
https://vue-data-ui.graphieros.com/
MIT License
267 stars 13 forks source link

Larger Gap between Bar Datasets in XY Chart #30

Closed lovlyx closed 3 months ago

lovlyx commented 3 months ago

When using 2+ bar datasets it is hard to distinguish the grouping since the padding is the same for elements within the group and outside of it. image

It would be awesome if we could somehow control the x-gap value, or if the default one could be increased. Here are some references for optimal gap between them: image

https://lumedataviz.com/chart-components/grouped-bar-chart/

Thank you again for the amazing work ❤️

graphieros commented 3 months ago

Hey @lovlyx :) Thanks for your issue, it's indeed a nice feature to have. After running some tests on a feature branch, it will be implemented soon.

I'll keep you posted. Cheers

lovlyx commented 3 months ago

Thank you! Looking forward to it 👀

graphieros commented 3 months ago

@lovlyx you can update to v2.1.90

A new config attribute was added : config.bar.periodGap (default: 0.1) For your specific use case, you might consider a value between 0.1 and 0.25