Resize the chart

[PhilHannent]

Hi,

I would like to adjust the charts height after it has been drawn.  For example, if I output a chart and the user decided that the x axis labels were making the chart unreadable.  Then I want to offer a text box that resizes the containing div and then gets the chart repainted into it.  However the best I can get is that the chart is created as I want it however an old chart pane is visible but empty.

This is the code I am currently using:

function setHeightOfChart() {
    document.getElementById("ChartDiv1").style.height = ($(window).innerHeight() * (document.getElementById("CHARTDEPTH").value / 100)) + "px";
    chart1.updateSizeNow();
    chart1.create(document.getElementById("ChartDiv1"));
}

 

 

[JuanC]

You do not want to call again chart1.create as this will create another SVG. There is an undocumented method in the chart class that will update the chart after the div size has been changed.

chart1.doUpdate(true)

JuanC

[PhilHannent]

Thats just the function call I am looking for.  However IE9 reports:

SCRIPT438: Object doesn't support property or method 'doUpdate'

Do I need a newer version?  How can I best track my version?

Phil

[JuanC]

I apologize, the version we are currently shipping has this function obfuscated. I will make sure our next build (probably available in a couple of days or so) has a public doUpdate method you can call.

If you want to try it now, the obfuscated method name is _ud so your code would be chart._ud(true)

JuanC 

[PhilHannent]

Perfect thank you.

Is there a newsfeed or email newsletter for notifying of updates?

Thanks

Phil

MyRealTimeChart.zip

[Lintex]

Hi, I'm trying to make my webapp responsive and resizing the charts is very important, this is my code:

$(function(){

            $(window).resize(function(){

            var graficos = new Array();

            graficos = document.getElementsByClassName('jchartfx');

            for (var i = 0; i < graficos.length; i++)

 {

     graficos.doUpdate(true);

 }

            });

        }); 

 

So everytime the user resizes the window, the chart should resize too, but i can't get it to work, and keep getting this error

Uncaught TypeError: Object #<HTMLDivElement> has no method 'doUpdate' 

i've tried using the div and the svg element with the same result, I hope you can help me.

 

Thank you. 

[JuanC]

The doUpdate function is still obfuscated so you still have to use _ud

Note the function is not exposed in the SVG element or Div, It is exposed in the javascript object you create when you do new cfx.Chart()

 

JuanC 

[Lintex]

OMG!! this works great!!  Thank you very much!!

[conan59]

Thank you JuanC... I also tried it and worked perfectly (with chart1._ud(true)

[RoHi]

Hi Lintex,

 

How did you make it work?

 

RoHi