Yi, Here's a video of what I was trying to achieve. Notice how the right y-axes will adjust to fit the labels when the animation finishes and the `grid.right` also changes.
https://drive.google.com/file/d/1ZteuLiBba2qpvkbriRHkMjt388sJgvwG/view?usp=sharing On Mon, Mar 1, 2021 at 8:44 AM Jonathan Avila <avilajonat...@gmail.com> wrote: > Hi Yi, > > Thanks for the reply. I had given `registerPostUpdate` a try, but on the > very first rendering, it will still execute before the yAxisView has > rendered and `getBoundingRect` returns width and height of 0. The reason > why I can't easily calculate the offset manually is because our app allows > users to configure the number of axes and the metric used in each axis. In > this "data exploration" mode, the required offset and width of each axis > can change quite a bit based on things like the label formatting and the > axis extent. > > In an ideal world, we'd have some sort of `auto` offset with some small > gap between each axis, but or now, I was able to achieve what I'm looking > for using `chart.on('finished', handler)` + setOption. It's working well > for me, but I have to make sure I use lazyUpdate for setOption when I > calculate the offset of each axis based on the offset of the axis to the > left. > > I'll try and follow with a reply that contains a GIF to show the result of > what I did. > > Thanks > > Jonathan > > > On Mon, Mar 1, 2021 at 4:00 AM Yi Shen <shenyi....@gmail.com> wrote: > >> Hi Jonathan, >> >> echarts is rendered synchronously after `setOption`. So you can always >> use `view.group.getBoundingRect` to get the bounds after `setOption`. >> Or if you wan't to do it before rendering to canvas. There is a stage >> post update that can be extended by `registerPostUpdate`. >> >> But I will suggest you calculating the right offset according to the axis >> number and maximum width of the axis labels, which I think is not hard to >> get if the result is not required to be very accurate. >> >> Regards >> >> On Mon, Feb 22, 2021 at 10:33 PM Jonathan Avila <avilajonat...@gmail.com> >> wrote: >> >>> Hi Echart Dev Team, >>> >>> I'm working on a chart that will have a dynamic number of y axis >>> positioned >>> to the right. I want to be able to set the right offset for each axis to >>> avoid label overlap, but I would like to avoid setting a fixed number for >>> the offset to maximize the available space. >>> >>> My first attempt was to try and use `echarts.registerVisual` function to >>> get the ComponentView and then get its width and height with >>> `view.group.getBoundingRect()`. Unfortunately, the method will execute >>> before the axis view has rendered, so the boundingRect will have width 0 >>> and height 0. Do you guys have any suggestions on how I could proceed? Is >>> there a way that I listen for a render event on an component view or >>> perhaps some zRender event that I can try? >>> >>> Thanks, >>> >>> Jonathan >>> >> >> >> -- >> Yi Shen >> Apache ECharts(incubating) PMC >> >
