apache / echarts

Apache ECharts is a powerful, interactive charting and data visualization library for browser
https://echarts.apache.org
Apache License 2.0
60.62k stars 19.61k forks source link

[Feature] Offset for bar type series #20409

Open Andrea-LaRoss opened 1 month ago

Andrea-LaRoss commented 1 month ago

What problem does this feature solve?

Hi, In my project i have a timeseries that some line types series and some bars type series. One of the lines can be either a step start or a step end. Is it possible to align the bars type series to the lines maybe adding some type of offset?

What does the proposed API look like?

graphics_bars

helgasoft commented 1 month ago

align the bars type series to the lines

You didn't specify how to align... By default, line points are positioned in the middle of bars (your example chart). Points could also be aligned to start or end of bars. Adding an empty bar series before or after the stacked ones creates the offset. Demo. image 📌 please close issue if problem solved.

Andrea-LaRoss commented 1 month ago

Yes sorry for not specifing. What i meant to request was some type of property of bars series that allow to have an horizontal offset positioning them before or after a point of line series regardless of the barStack or the barGap properties and the addition of an empty bar series, because if i add a barWidth bars will return in the middle of points. Is there a workaround to maintain this type of offset even when i add barWidth?

helgasoft commented 4 weeks ago

Is there a workaround to maintain this type of offset even when i add barWidth?

did you try barWidth on all seeries, even the empty one ? it works.

Andrea-LaRoss commented 4 weeks ago

Yes like this works thank you very much. Last thing I need is this to work when I set barGap to '-100%' to get overlapping bars like here Overlapping bars. Do you know any way to achieve that type of offset?

helgasoft commented 3 weeks ago

get overlapping bars.. Do you know any way to achieve that type of offset?

yes, with two X-axes, Demo image