AnyChart
AnyChart copied to clipboard
Resizing the chart container?
Hi,
I have the #container with absolute positioning (width:100%;height:100%) however when the parent (relative) resizes, the chart doesn't resize.
I can't find any reference in the doc to resizing or even setting the width/height via code.
Here's the container after I resize the window:
The SVG element is properly scaled:
The chart itself isn't scaling:
I tried to call the chart.draw() method when the container resizes, but it's not working.
How can I fix this?
Thanks.
@26medias
The AnyChart library doesn't affect the HTML layout and can't control it. The chart always fits the container if bounds are not applied manually in JS code - bounds()
function. Anyway, it can't expand or collapse the HTML container. It affects only svg inside it.
All issues with resizing the chart container may come from CSS settings.
You should inherit styles to make width and height percents work as expected. For details, check the sample, try to resize the chart, and pay attention to CSS.
Thanks for the reply.
So there's no method I can call to force the chart to resize to its container? (the div targeted in chart.container('container');
)
@26medias There's no need for this method. If you didn't apply bounds() settings manually, then the chart always fits the parent container on the fly. If you can provide a sample, that reproduces the issue on Playground, then we can review it to find what's wrong with the container.