How To Auto Resize Text

[SimonH]

Hi,

 

we have recently bought the current FusionChats at our company. At the moment I'm working at a project where we want to display a chart both at a big flat sceens on a wall and at smart phones. Because the chart will be watched at from far away using the big flat screens, I've chosen a quite big front size (32).

I've used the percent-resize method described here http://www.fusioncharts.com/docs/advanced/PercentResize.html to make the chart dynamic. It is scaling correct if I resize the browser to a smaller screen size.

 

My problem is, that the font size is in opposite to the chart not scaling. The font size stayes very big even if I resize the browser and thus the chart gets resized. How can I change that? The requirment is, that the labels of the FusionChart are resizing together with the chart.

 

I've looked at the documentation, the knowledgebase and searched the forum, but didn't find a solution. Could you please help me?

 

Thanks,

Simon

[Guest Angshu]

Hi,

 

Welcome to FusionCharts Forum!

 

Please note that the percent-resize method resizes the chart only, it does not resize font size.

 

You would need to apply STYLES to change the font size of your chart .

 

For more details, please visit the link below:

 

http://www.fusioncha...les/Styles.html

 

http://www.fusioncha...s/HowToUse.html

 

http://www.fusioncha...tyles/Font.html

 

Hope this helps.

[SimonH]

Hi,

 

thanks for your reply.

At first I did define the font size in the XML chart element

<chart BaseFontSize="32" ...>

I've changed that and now use styles, as you prosposed. (Sady I coudn't find a object name for the legend!)

<styles>
<definition>
 <style name='MyFirstFontStyle' type='font' size='32' />
</definition>
<application>
 <apply toObject='Caption' styles='MyFirstFontStyle' />
 <apply toObject='DATALABELS' styles='MyFirstFontStyle' />
 <apply toObject='DATAVALUES' styles='MyFirstFontStyle' />
 <apply toObject='TOOLTIP' styles='MyFirstFontStyle' />
 <apply toObject='XAXISNAME' styles='MyFirstFontStyle' />
 <apply toObject='YAXISNAME' styles='MyFirstFontStyle' />
 <apply toObject='YAXISVALUES' styles='MyFirstFontStyle' />
</application>
</styles>

 

Unfortunately this doesn't fullfill our requirement. The font size is still not scaling if I resize the browser window. At big screens everything is okay. But if I resize the browser window to simulate a smaller screen only the chart gets resized correctly. The font stayes much to big and is not changing at all.

So my question remains, how can I resize the text labels automaticaly together with the chart?

 

Thanks,

Simon

Edited October 21, 2011 by SimonH

[Guest Angshu]

Hi,

 

Could you please confirm the FusionCharts version and chart type (swf) you are using?

 

Awaiting for your response.

[SimonH]

Hi,

 

Hi,

 

Could you please confirm the FusionCharts version and chart type (swf) you are using?

 

Awaiting for your response.

 

FusionChart version: still using the trial version. 3.2.1 is the version number, said in FusionCharts.js

Chart Type: MSBar2D.swf

 

Thx,

Simon

[Sanjukta]

Hi,

 

Please note that the text on the chart does not resize when the chart resizes.

 

The text on the chart is a component of the chart and the resizing feature is related to the HTML container that contains the chart.

 

Hope this helps.

[Guest Angshu]

Hi,

Thanks for your response.

I am afraid, this is not possible with FusionCharts, as of now.

However, in Flash chart you can set the scaleMode to exactFit and after rendering if one resize the rendered chart the text will scale with the size of the chart.

Hope this helps.

[SimonH]

Hi,

thanks for your replies.

 

Hi,

 

Please note that the text on the chart does not resize when the chart resizes.

 

The text on the chart is a component of the chart and the resizing feature is related to the HTML container that contains the chart.

 

Hope this helps.

Sad to hear. Are there plans to change that? How long would it take for you to implement it and push a new version?

 

 

Hi,

Thanks for your response.

I am afraid, this is not possible with FusionCharts, as of now.

However, in Flash chart you can set the scaleMode to exactFit and after rendering if one resize the rendered chart the text will scale with the size of the chart.

Hope this helps.

 

Maybe this would be a workaround. I'm not understanding your prosposal completly. Could you please explain me how to do that? I use following javascript snippet in my html page:

<script type="text/javascript"><!--         

//     FusionCharts.setCurrentRenderer('javascript')

    //SWF-Datei, id des Charts, Breite & Höhe (in Pixel, ohne "px"), Debug, registerWithJS (deprecated, immer 1)
     var myChart = new FusionCharts( "/path/to/MSBar2D.swf", 
     "myChartId", "100%", "100%", "0", "1");
     myChart.setXMLUrl("bandauslastung.xml");
     myChart.render("chartContainer");

   // -->     
   </script>

I've searched the help, found this article http://www.fusioncha...PI/Methods.html , and now changed my javascript to the following:

<script type="text/javascript"><!--         

//     FusionCharts.setCurrentRenderer('javascript')

    //SWF-Datei, id des Charts, Breite & Höhe (in Pixel, ohne "px"), Debug, registerWithJS (deprecated, immer 1)
     var myChart = new FusionCharts( "/path/to/MSBar2D.swf", 
     "myChartId", "100%", "100%", "0", "1", {scaleMode : "ExactFit"});
     myChart.setXMLUrl("bandauslastung.xml");
     myChart.render("chartContainer");

   // -->     
   </script>

 

The background of my chart is now rendered turquoise, I probaply got the syntax wrong. The text is still not automatically scaling...

 

Thanks for your help,

Simon

[SimonH]

The background of my chart is now rendered turquoise, I probaply got the syntax wrong. The text is still not automatically scaling...

 

*Push*

 

Any help for the correct syntax?

 

Thx,

Simon

[ssawchenko]

Did you ever find a solution for this? I am looking for the same functionality (text autoresize).

What is weird, is that I have setup my annotation text such that THEY resize... but the text that is automatically generated on the chart (I am using an angular gauge) does not resize.

 

 

 

[SimonH]

Did you ever find a solution for this? I am looking for the same functionality (text autoresize).

What is weird, is that I have setup my annotation text such that THEY resize... but the text that is automatically generated on the chart (I am using an angular gauge) does not resize.

Sorry, no, I din't find any solution. And the support here in the forum also fell silent.

If you find any solution, I would be interessted in getting to know it.

 

Simon

[Guest Sumedh]

Hi,

 

I am afraid, text auto-resize is not supported, as of now.

 

As a work-around, you can use scale mode parameter in the FusionCharts object as mentioned in the previous post.

 

Set {scale mode : "Exact Fit"}

 

Ref. code:

 

var myWidget=new FusionCharts("Charts/AngularGauge.swf","myChartId","100%","100%","0","1",{scaleMode:"Exact Fit"});

 

Hope this helps.

[SimonH]

Hi,

Hi,

 

I am afraid, text auto-resize is not supported, as of now.

 

As a work-around, you can use scale mode parameter in the FusionCharts object as mentioned in the previous post.

 

Set {scale mode : "Exact Fit"}

 

Ref. code:

 

var myWidget=new FusionCharts("Charts/AngularGauge.swf","myChartId","100%","100%","0","1",{scaleMode:"Exact Fit"});

 

Hope this helps.

Thanks for your reply. As written in my post from 2011-10-21 I've tried that and the only change I got, was a turquoise chart background color. That's not what I wanted... I just tried it again with this code (having a close look to the spaces), but the result---a turquoise background---is still the same: var myChart = new FusionCharts( "/path/to/MSBar2D.swf", "myChartId", "100%", "100%", "0", "1", {scaleMode:"ExactFit"}); Simon

[Guest Sumedh]

Hi,

 

I am afraid, it is the only work-around for auto-resize for text.

 

The text on the chart is a component of the chart and the resizing feature is related to the HTML container that contains the chart.

 

Thanks for your support and patience.