echarts [Feature] Maintaining dynamic bar width based on the series data

wlp8pajw  于 3个月前  发布在  Echarts
关注(0)|答案(8)|浏览(80)

What problem does this feature solve?

Is it possible to maintain the bar width dynamically based on series data availability?

What does the proposed API look like?

NA

1sbrub3j

1sbrub3j1#

Any example of "series data availability" ?

s71maibg

s71maibg2#

Any example of "series data availability" ?

Example 1 -
series: [
{
name: 'Max',
type: 'bar',
data: [40,10,15,67,50,34,23,28]
}
]

Series array has 8 number of data. So, the bar count increase, gap between two bars adjusted as per this, bar width also maintained automatically.

Now if I remove some of the data from the series data array. As example below,
Example 2 -
series: [
{
name: 'Max',
type: 'bar',
data: [40,10,15]
}
]

Bar width increased. gap between bar also maintained proportionally.
But, I want to keep the bar width maintained same in all the cases where ever data increase/decrease inside the series array. And the gap between bars can maintain a such way so that bars can be spread throughout the chart body all the time.
Like the above 2 examples, bars have been spread all over the chart this is good. But the width of bar is increasing that need to keep same. Instead of increase the bar width if we can increase the gap between 2 bars then it can be spread all over the chart but not only the left/right/center aligned.

This is only asking for better UI representation.

vaj7vani

vaj7vani3#

There is no problem if Xaxis data remains the same - Demo Code .

gijlo24d

gijlo24d4#

There is no problem if Xaxis data remains the same - Demo Code .

Yes, We can do that like all bar is shifted to the left. The right side there is a blank spaces. So, I wanted to spread the bars through out the chart area. The spaces in between bars will increase/decrease. Example demo screenshot below,

w8rqjzmb

w8rqjzmb5#

But the width of bar is increasing that need to keep same.

use barWidth - Demo Code

jfgube3f

jfgube3f6#

But the width of bar is increasing that need to keep same.

use barWidth - Demo Code

Yes, to keep bar width same we can use barwidth property. But it will aligned in left. So, I was seeking any way out to spread the bars in total chart area and increase gap in between each bar.

f4t66c6m

f4t66c6m7#

There is no problem if Xaxis data remains the same - Demo Code .

is it possible to get this without setting extra labels in xAxis? I have added barWidth to reduce with of bar but i don't want big space between bars. it should be all aligned to left.

ubby3x7f

ubby3x7f8#

It is possible to control both barWidth and xAxis depending on series data.
But usually just updating the axis is enough, leaving barWidth to auto-resize.
Demo Code with dynamic data.

相关问题