setDataXML

[punkers]

Hi guys,

 

 

 

I have got a problem trying to update data inside a chart. This is my code:

 

 

 

var chart1 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "1", "130", "70", "0", "1");

 

.......

 

 

 

var chartObj = getChartFromId("1");

 

chartObj.setDataXML(xmlHttp.responseText);

 

 

 

 

 

the object xmlHttp.responseText contains the correct xml file.

 

I got this error chartObj.setDataXML is not a function. I 've read the other related topics on the forum but I couldn't fix this error.

 

 

 

Thx for your help.

[FusionCharts Support]

Hi,

Could you please check if you are placing the chart inside a FORM element.

If you are doing so please use our latest FusionCharts.js that contains the fix for FORM. The latest JS is version 1.2 (1st November, 2007) . This can be found on the header of the JS file. You can download the latest JS with the latest Evaluation download or  from our Product Update Center at http://www.fusioncharts.com/PUC.

Please also note that you would need to replace all " in the XML to ' (var xml=xmlHttp.responseText.replace(/'/g,'%26apos;');xml=xml.replace(/"/g,"'"); )

[punkers]

Hi,

 

 

 

 

 

The chart is not inside a form, I changed the Xml as you said but I still get the same error.

 

 

 

Thx for your help.

[FusionCharts Support]

Hi,

Could you please send us the code that you are using?

Also please make sure that the chart is getting fully loaded and rendered before you try updating the chart. This can be tracked using FC_Rendered() function.

Edited July 7, 2008 by Guest

[punkers]

Hi,

 

 

 

Have you received my code?

 

Any news?

 

 

 

Thx

 

 

 

Fabio

[FusionCharts Support]

Hi,

There must be something which might be interfaring with the DOM and the <object> /<embed> element 's ID. We have tried with the same code in our labs and did not encounter any problem.

Could you please let us know the Flash Player version that you are using and whether you are using any other JS Frameworks.

[FusionCharts Support]

Hi,

Also please check whether the chart has been loaded when rendered for the first time. Please try once setting the debug mode which would open a window over the blank chart that you had loaded before updating using AJAX. If you dont find the debug window loaded, you might be having some path issues which is failing to load the chart initially.

var chart1 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "1", "130", "70", "1", "1");

Also, when you load the chart as a blank chart its more appropriate to use :

chart1.setDataXML("<chart></chart>");

chart1.render("chartdiv1");

This would create a chart with a label "no data to display" at the centre of the blank chart.

[punkers]

Hi,

 

 

 

I created a page with just the chart and the select box in it. Now I don't get any javascript error but the chart doesn't change.

 

 

 

Thx,

 

 

 

Fabio

[FusionCharts Support]

Hi,

could you please attach here (also for the benefit other others facing similar issues) the code that you are using. Since its a small code, we might debug it and repost it here.

Please also mention the platfor that you are using and browsers with versions that you are using.

[punkers]

Hi,

 

 

 

The code is:

 

 

 

javascript

 

 

 

 

 

var chart1 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "1", "130", "70", "0", "1");

var chart2 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "2", "130", "70", "0", "1");



function submitChart(chartNum,d1,d2)

{ 

url="/REGION/fusionchartxml.html?";

url = url+"chartID="+chartNum+"&tn=1&d1="+d1+"&d2="+d2;

var xmlHttp;



try

 {

 // Firefox, Opera 8.0+, Safari

 xmlHttp=new XMLHttpRequest();

 }

catch (e)

 {

 // Internet Explorer

 try

   {

   xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

   }

 catch (e)

   {

   try

     {

     xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

     }

   catch (e)

     {

     alert("Your browser does not support AJAX!");

     return false;

     }

   }

 }

 xmlHttp.onreadystatechange=function()

   {

   if(xmlHttp.readyState==4)

     {



    if(xmlHttp.responseText!= null & xmlHttp.responseText!= ' '){

    var xml=xmlHttp.responseText.replace(/'/g,'%26apos;');xml=xml.replace(/"/g,"'"); 

    if(chartNum ==1 ){

    var chartObj = getChartFromId("1");

 chartObj.setDataXML(xml);

    chartObj.render("chartdiv1");

    }else{

var chartObj = getChartFromId("2");

    chartOb.setDataXML(xml;

    chartOb.render("chartdiv2");

    }

}

     }

   }

 xmlHttp.open("GET",url,true);

 xmlHttp.send(null);



} 

 

 

 

jsp

 

 

 

 

 

div id="chartdiv1" align="center">The chart will appear within this DIV. This text will be replaced by the chart.

 

 

 

 

 

script>

 

<%urlEncodedURL = "/REGION/fusionchartxml.html?" + URLEncoder.encode("chartID=0&tn=1&d1="+endDate+"&d2="+selectedDate, "UTF-8");

 

%>

 

chart1.setDataURL("<%=urlEncodedURL%>");

 

chart1.render("chartdiv1");

 

/script>

 

 

 

 

 

select name="range" onchange="submitChart('1','01-may-08','31-may-08')">

 

option value ="0">1 week

 

option value ="1">2 weeks

 

option value ="2">3 weeks

 

option value ="3">1month

 

option value ="4">2months

 

/select>

 

 

 

 

 

The code tag wasn't working for the last bit of code so I just cut the beginning of the tags.

 

 

 

I'm using Firefox 2 and IE 7 with Tomcat and java 1.4.2.

 

 

 

Thanks,

 

 

 

Fabio

Edited July 8, 2008 by Guest

[punkers]

Hi guys,

 

 

 

I fixed my problem.

 

 

 

Instead of using the javascript function setDataXML or set setDataURL i'm directly getting the component from the page and set the new attribute.

 

 

 

this is the snippet of my javascript function, chart1 is the id of the chart in the page.

 

var chart1 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "chart1", "130", "70", "0", "1");



url1="/REGION/fusionchartxml.html?";

url1 = url1+"chartID=1&tn=1&d1="+d1+"&d2="+d2;

chart1.variables.dataURL = encodeURIComponent(url1);

chart1.render("chartdiv1");

 

 

 

Thx,

 

 

 

Fabio

[FusionCharts Support]

Hi,

Please find the modified script:

var chart1 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "CH1", "230", "170", "0", "1");

var chart2 = new FusionCharts("${externalURL}flash/fusion/Line.swf", "CH2", "230", "170", "0", "1");

function submitChart(chartNum,d1,d2)

{

url="/REGION/fusionchartxml.html?";

url = url+"chartID="+chartNum+"&tn=1&d1="+d1+"&d2="+d2;

var xmlHttp;

try

  {

  // Firefox, Opera 8.0+, Safari

  xmlHttp=new XMLHttpRequest();

  }

catch (e)

  {

  // Internet Explorer

  try

  {

  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

  }

  catch (e)

  {

  try

  {

  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

  }

  catch (e)

  {

  alert("Your browser does not support AJAX!");

  return false;

  }

  }

  }

  xmlHttp.onreadystatechange=function()

  {

  if(xmlHttp.readyState==4)

  {

if(xmlHttp.responseText!= null & xmlHttp.responseText!= ' '){

var xml=xmlHttp.responseText;

  xml=xml.replace(/"/g,"'").replace(/|r|t|v/g,"");

if(chartNum==1 ){

var chartObj = getChartFromId("CH1");

  chartObj.setDataXML(xml);

//chartObj.render("chartdiv1");

}else{

  alert(chartNum);

  var chartObj = getChartFromId("CH2");

chartObj.setDataXML(xml);

//chartOb.render("chartdiv2");

}

}

  }

  }

  xmlHttp.open("GET",url,true);

  xmlHttp.send(null);

}

Please note :

1. Its better to use chart DOM ID starting with an alphabet (as we follow variable naming rules). Here, I have used 2 IDs CH1 and CH2

2. Replacing all newline, linefeed, carraige return, tabs from the XML and converting all double quotes " to single quotes '.

3. There is no need to use render() again when just updating an existing chart which has been rendered before hand.

-------------------------------------------------

Please also note that instead of AJAX, you can use setDataURL(URL). This would do the same function of updating the chart in the same AJAX fashion, plus reducing many lines from your code.

[FusionCharts Support]

So,

instead of

chart1.variables.dataURL = encodeURIComponent(url1);

you can use

chart1.setDataURL(escape(url1));