Need x,y,Width,Height of the chart elements

[RavalikaP]

What problem does this feature solve?

Need X, Y position along with Height and Weight of the chart elements like xAxis, yAxis, Grid, Legends.
If we get this values we will append some graphic elements to it and apply some styling to it.

What does the proposed API look like?

[Ovilia]

There are no such APIs but you can get this information option.grid and option.legend from your input option.

[RavalikaP]

@Ovilia but on option.legend and option.grid we are not getting the updated values. If it is updated then it will be easy to get it.

[plainheart]

You may get such information via some internal APIs. Just FYI.

Grid

// if there are multiple grids, use `getComponent('grid', gridIndex)`
const gridRect = chart.getModel().getComponent('grid').coordinateSystem.getRect();

Axis

// if there are multiple axes, use `getComponent('xAxis', axisIndex)`
const xAxisModel = chart.getModel().getComponent('xAxis');
const xAxisView = chart.getViewOfComponentModel(xAxisModel);
const xAxisRect = xAxisView.group.getBoundingRect();

[RavalikaP]

@plainheart , Thank you for the reply. can u please suggest me how to get the legends?

[plainheart]

@RavalikaP It's similar to the above.

const legendModel = chart.getModel().getComponent('legend');
const legendView = chart.getViewOfComponentModel(legendModel);
const legendRect = legendView.group.getBoundingRect();
const [x, y] = legendView.group.transformCoordToGlobal(legendRect.x, legendRect.y);
const { width, height } = legendRect;
console.log(x, y, width, height);