Hello.
My company new web application must show dynamic resizeable charts.
To ensure mobile version we are using FusionCharts XT 3.3.1 with javascript render only.
We have encoutered a nasty problem while we were trying to add a charts with dynamic changing height. If we create the chart with percentage size, like:
var chart = new FusionCharts("Bar2D", "myChartId", "100%", "100%", "0");
the chart is correctly created, but if the html element containing the chart <div> changes size only the chart width changes too, and its height stays the same as the creation height was.
I've examined the page DOM. It looks like the <span> wrapper created by FusionCharts always has a fixed pixel height instead of the percentage height. Only <span> width is correctly sets at "100%":
<span style="position: relative; text-align: left; line-height: 100%; display: inline-block; width: 100%; height: 334px;" id="myChartId">
<svg style="overflow: hidden; -moz-user-select: none; cursor: default; position: relative; background-color: rgb(255, 255, 255);" xmlns="http://www.w3.org/2000/svg" width="200" version="1.1" height="334">
...
</svg>
</span>
It's a big issue.
Could the height of a javascript chart be dynamic too? It requires javascript additional handlers?
I've attached to this post a almost working example. If you want to try it you only have to modify the fusioncharts javascript inclusion at line:29
Thanks for your time,
Mauro
fusioncharts-javascript-render-dynamic-height-fails.zip