Sign in to follow this  
Followers 0
gdsimz

fusioncharts endlessly loops through unknown/nonexistent chart objects

By gdsimz, in Javascript Problems

Recommended Posts

gdsimz   

gdsimz
Posted

I have a multiple zoomline charts using Fusioncharts 3.7.1 that are constructed in the following manner json datasource responses like the following:

 

..
$.get( dataURL, function( data ) {
var strl = data.length;
var n = data.indexOf('{"dataModel":');
var res = data.substr(n+13, strl);
var fnlVal = res.substr(0,res.length-1);
chartContainerDIV1.setChartData(fnlVal, 'json');
});
..

chartContainerDIV1.render("chartContainerDIV1"+Ext.getCmp('dynamicTagValue').text);
chartContainerDIV1.addEventListener ("beforeResize", function (eventObj, dataObj) {console.log( eventObj.sender.id + " is resizing" );Ext.getBody().mask("Please wait...");});
chartContainerDIV1.addEventListener ("drawComplete", function (eventObj, dataObj) {console.log( eventObj.sender.id + " is is drawn" );Ext.getBody().unmask();});
chartContainerDIV1.addEventListener ("rendered" , function (eventObject) {
chartContainer5.setChartAttribute({
"caption": "Test ",
"subCaption": Ext.getCmp('selectedDuration').text,
"xAxisName": Ext.getCmp('selectedDuration').text,
"yAxisName": "Calls",
"yaxisminvalue": "-2",
"yaxismaxvalue": "2",
"forceaxislimits": "1",
"pixelsperpoint": "0",
"pixelsperlabel": "30",
"linethickness": "1",
"compactdatamode": "1",
"dataseparator": "|",
"theme": "fint",
"paletteColors": "c55c5a,#4d79ab",
"dataPath": serviceURL
});
createThumbNail(chartContainerDIV1.id, '95%', '150', "chartContainerDIV11"+Ext.getCmp('selectedDuration').value);
createThumbNail(chartContainerDIV1.id, '95%', '90%', "chartContainerDIV17"++Ext.getCmp('selectedDuration').value);
console.log( eventObject.sender.id + " has rendered drawing" );

There are random moments as tabs are created encompassing these charts that line 70 of fusioncharts just increments to check chart objects infinitely.

 

fusionChart.js throws a looping error beyond the number of chart objects within the web application as shown:

 

Uncaught RuntimeException: #03091456 chartobject-211.render() Error >> Unable to find the container DOM element.e.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1440681466266:145491(anonymous function) @ app.js?_dc=1440681466266:145776b @ fusioncharts.js:34N @ fusioncharts.js:34J.triggerEvent @ fusioncharts.js:38e.raiseEvent @ fusioncharts.js:38e.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:758
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-212.render() Error >> Unable to find the container DOM element.e.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1440681466266:145491(anonymous function) @ app.js?_dc=1440681466266:145711b @ fusioncharts.js:34N @ fusioncharts.js:34J.triggerEvent @ fusioncharts.js:38e.raiseEvent @ fusioncharts.js:38e.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:758
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-213.render() Error >> Unable to find the container DOM element.e.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1440681466266:145491(anonymous function) @ app.js?_dc=1440681466266:145712b @ fusioncharts.js:34N @ fusioncharts.js:34J.triggerEvent @ fusioncharts.js:38e.raiseEvent @ fusioncharts.js:38e.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:758
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-214.render() Error >> Unable to find the container DOM element.e.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1440681466266:145491(anonymous function) @ app.js?_dc=1440681466266:145839b @ fusioncharts.js:34N @ fusioncharts.js:34J.triggerEvent @ fusioncharts.js:38e.raiseEvent @ fusioncharts.js:38e.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:758
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-215.render() Error >> Unable to find the container DOM element.e.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1440681466266:145491(anonymous function) @ app.js?_dc=1440681466266:145840b @ fusioncharts.js:34N @ fusioncharts.js:34J.triggerEvent @ fusioncharts.js:38e.raiseEvent @ fusioncharts.js:38e.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:758
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-216.render() Error >> Unable to find the container DOM element.e.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1440681466266:145491(anonymous function) @ app.js?_dc=1440681466266:145581b @ fusioncharts.js:34N @ fusioncharts.js:34J.triggerEvent @ fusioncharts.js:38e.raiseEvent @ fusioncharts.js:38e.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:758
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-217.render() Error >> Unable to find the container DOM element.
 
Which is strange because there are way less chart objects that have been created.
 
How to get this to stop?
 
Thanks in Advance

Share this post

Link to post
Share on other sites

Vishalika   

Vishalika
Posted

Hi,

 

As per the logs,it seems that you are trying to re render the charts.

 

Please confirm if dispose() API is used in this case, if not then dispose the chart and again re render it.

 

Refer this link: http://www.fusioncharts.com/dev/api/fusioncharts/fusioncharts-methods.html#dispose

 

Sample implementation: http://jsfiddle.net/vishalika/hpzv9qf8/

 

Hope this helps.

Share this post

Link to post
Share on other sites

gdsimz   

gdsimz
Posted

Hi Vishalika,

 

The code is never re-rendered, but it's happening when tabs are created.  For example like the tabs on this page: http://www.jankoatwarpspeed.com/wp-content/uploads/examples/dynamic_tabs/# 

 

There are dynamic tabs and each tab has dynamically named divs for the chart objects to sit in.  Chart objects are created with selection data and rendered to divs only once.

 

When user selects certain options and clicks a button, it creates a tab.  The first tab runs as expected with fusioncharts as chart-objects 1 through 9  populate TabA chartcontainer divs.  

 

 

The bug is when a second TabB is created dynamically creating the divs for TabB chart Objects.  chart-objects 9 through 18 for TabB populate and create the thumbnails, but then FusionCharts cycles through the chart objects again and again creating infinite thumbnail chart-objects:

 

Here chartobject-53 through 57 actually exist get cycled through over and over (there is no loop or while statements in my code by the way) until iteration goes beyond what exists

 
app.js?_dc=1441222287520:148534 chartobject-53 has rendered drawing
app.js?_dc=1441222287520:148578 chartobject-54 is is drawn
app.js?_dc=1441222287520:148600 chartobject-54 has rendered drawing
app.js?_dc=1441222287520:148641 chartobject-55 is is drawn
app.js?_dc=1441222287520:148664 chartobject-55 has rendered drawing
app.js?_dc=1441222287520:148705 chartobject-56 is is drawn
app.js?_dc=1441222287520:148728 chartobject-56 has rendered drawing
app.js?_dc=1441222287520:148769 chartobject-57 is is drawn
app.js?_dc=1441222287520:148792 chartobject-57 has rendered drawing
app.js?_dc=1441222287520:148511 chartobject-53 is is drawn
app.js?_dc=1441222287520:148534 chartobject-53 has rendered drawing
app.js?_dc=1441222287520:148578 chartobject-54 is is drawn
app.js?_dc=1441222287520:148600 chartobject-54 has rendered drawing
app.js?_dc=1441222287520:148641 chartobject-55 is is drawn
app.js?_dc=1441222287520:148664 chartobject-55 has rendered drawing
app.js?_dc=1441222287520:148705 chartobject-56 is is drawn
app.js?_dc=1441222287520:148728 chartobject-56 has rendered drawing
app.js?_dc=1441222287520:148769 chartobject-57 is is drawn
app.js?_dc=1441222287520:148792 chartobject-57 has rendered drawing
app.js?_dc=1441222287520:148511 chartobject-53 is is drawn
app.js?_dc=1441222287520:148534 chartobject-53 has rendered drawing
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-81.render() Error >> Unable to find the container DOM element.d.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1441222287520:148442(anonymous function) @ app.js?_dc=1441222287520:148533b @ fusioncharts.js:34G @ fusioncharts.js:34I.triggerEvent @ fusioncharts.js:38d.raiseEvent @ fusioncharts.js:38d.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:762
app.js?_dc=1441222287520:148578 chartobject-54 is is drawn
app.js?_dc=1441222287520:148600 chartobject-54 has rendered drawing
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-83.render() Error >> Unable to find the container DOM element.d.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1441222287520:148442(anonymous function) @ app.js?_dc=1441222287520:148599b @ fusioncharts.js:34G @ fusioncharts.js:34I.triggerEvent @ fusioncharts.js:38d.raiseEvent @ fusioncharts.js:38d.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:762
app.js?_dc=1441222287520:148641 chartobject-55 is is drawn
app.js?_dc=1441222287520:148664 chartobject-55 has rendered drawing
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-85.render() Error >> Unable to find the container DOM element.d.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1441222287520:148442(anonymous function) @ app.js?_dc=1441222287520:148663b @ fusioncharts.js:34G @ fusioncharts.js:34I.triggerEvent @ fusioncharts.js:38d.raiseEvent @ fusioncharts.js:38d.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:762
app.js?_dc=1441222287520:148705 chartobject-56 is is drawn
app.js?_dc=1441222287520:148728 chartobject-56 has rendered drawing
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-87.render() Error >> Unable to find the container DOM element.d.extend.render @ fusioncharts.js:70tp.add.items.items.listeners.afterrender.$.get.done.FusionCharts.ready.createThumbNail @ app.js?_dc=1441222287520:148442(anonymous function) @ app.js?_dc=1441222287520:148727b @ fusioncharts.js:34G @ fusioncharts.js:34I.triggerEvent @ fusioncharts.js:38d.raiseEvent @ fusioncharts.js:38d.raiseEventWithLegacy @ fusioncharts.js:39(anonymous function) @ fusioncharts.js:762
app.js?_dc=1441222287520:148769 chartobject-57 is is drawn
app.js?_dc=1441222287520:148792 chartobject-57 has rendered drawing
fusioncharts.js:70 Uncaught RuntimeException: #03091456 chartobject-89.render() Error >> Unable to find the container DOM element.

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
Sign in to follow this  
Followers 0
Go To Topic Listing Javascript Problems