hiphop101

Fusion Chart Xt Height Issue

Recommended Posts

Hi,

 

We're using fusion chart in my project to render charts, we had a framework which uses angularJS.

 

 

Below is the code snippet that generated for fusion, outside it is other stuff generated by angularJS.
<div id="chartContainer1366943041034" context="widgetContext()" widget-info="widgetInfo()">
	<span id="chartContainer1366943052501" style="position: relative; text-align: left; line-height: 100%; display: inline-block; zoom: 1; width: 100%; height: 276.8px; background-color: rgb(255, 255, 255);">
		<svg height="277" version="1.1" width="1251" xmlns="http://www.w3.org/2000/svg" style="overflow: hidden; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-select: none; cursor: default; position: relative; background-color: rgb(255, 255, 255);">

 

as you see, the height attribute in span is fixed pixel, whenever I do window re-size  I have noticed that the height won't change in both span and svg tag, when I re-size the width, the width in svg is changing according to my browser window which is working fine. I'm wondering is it controlled by fusion chart or by the parent?

 

 

 

javascript code:

FusionCharts.setCurrentRenderer('javascript');
var myChart = new FusionCharts( "Pie2D","myChartId", "100%", "100%", "0", "1");
myChart.setJSONData(jsondata2);
myChart.render("chartContainer");

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi,

 

Welcome to FusionCharts Forum.

 

While providing the chart dimension in percentage in the FusionCharts constructor, the chart will automatically adjust its dimension with respect to the parent container element.

 

So, could you please check whether you have set any fixed pixel value for the parent container element height?

 

If this is what is not able to resolve your issue, could you please provide the scaled down sample code snippet to look into it?

 

For more information on "Resizing Charts in Percentage", please follow the link below:

http://docs.fusioncharts.com/charts/contents/?advanced/PercentResize.html

 

Awaiting your response.

Share this post


Link to post
Share on other sites

Seems like the chart container itself is not getting the correct height. Could you try checking whether if you put in an element with relative positioning and 100% width and height within the container with a recognisable background color and check if it receives the correct percentage dimension?

 

Also, resize of container does not effectively fire resize event across all browsers. Try executing resizeTo forcibly if you can trap some other resize event of your UI framework.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now