wwilliams

FusionCharts not starting up when page first opened and not refreshing when xml file changes

By wwilliams, in Javascript Problems

Recommended Posts

wwilliams   

wwilliams
Posted

First , I am a noob so if this question is not in the right place or is not clear I apologize.

 

I created a multi page site for the internal use of my employer that has at least one chart on each page. I used Meteor to create the page. When it was a one page site with one chart fusioncharts would open right away and the charts were reactive as the xml file driving the chart changed, the chart would refresh. When I went to a multi page site, I lost the reactivity and the charts would never initiate on the first time opening a page. After you clicked to the page again or even a different page with a chart on it, fusioncharts would start. From then on you can click on a fusion charts page and it will open properly. When the xml files change however, the chart disappears and you have to open it twice again for it to reappear. When I look at the console I see this output:

 

Uncaught ReferenceError: FusionCharts is not defined
    at <anonymous>:2:1
    at Function.DOMRange._insertNodeWithHooks (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:407)
    at Function.DOMRange._insert (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:376)
    at Blaze._DOMRange.DOMRange.attach (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:453)
    at Function.DOMRange._insert (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:371)
    at Blaze._DOMRange.DOMRange.attach (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:453)
    at Function.DOMRange._insert (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:371)
    at Blaze._DOMRange.DOMRange.attach (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:453)
    at Function.DOMRange._insert (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:371)
    at Blaze._DOMRange.DOMRange.attach (blaze.js?hash=a1ff2d6d5ecd59ee11e2ba260b8650a9d1140f59:453)
fusioncharts.theme.fint.js:8 Uncaught ReferenceError: FusionCharts is not defined
    at fusioncharts.theme.fint.js:8
    at fusioncharts.theme.fint.js:8
fusioncharts.charts.js:6 Uncaught ReferenceError: FusionCharts is not defined
    at fusioncharts.charts.js:6
    at fusioncharts.charts.js:6

DevTools failed to parse SourceMap: http://192.168.110.217:3000/bootstrap.css.map

 

I have googled around trying to figure these messages out with no luck. I dont know if these messages have anything to do with fusioncharts behavior described above, but i think it is a good place to start. Any help or direction would be greatly appreciated. 

  

Share this post

Link to post
Share on other sites

Ayan Bhadury   

Ayan Bhadury
Posted

Hi,

Could you share us a live URL replicating the problem so that we could investigate it properly.

It seems like all the library files are not loaded properly before the charts are rendered please make sure that fusioncharts.js and other library files are loaded properly before the charts are rendered.

Share this post

Link to post
Share on other sites

wwilliams   

wwilliams
Posted

Ayan, Thank you for your help.  Taking your suggestion I tried loading the three fusioncharts scripts lines of code to the main & home templates:

<head>
<script type="text/javascript" src="fusioncharts/js/fusioncharts.js"></script>
<script type="text/javascript" src="fusioncharts/js/fusioncharts.charts.js"></script>
<script type="text/javascript" src="fusioncharts/js/themes/fusioncharts.theme.carbon.js"></script>
<script type="text/javascript">

That did  correct some of the behavior. I no longer have to click anything twice before fusioncharts loads. Thank you for that. I still need to figure out the reactivity issues. I used the xmlurl method to implement the charts and when those underlying xml files change the website does rebuild but fusioncharts doesnt reload for some reason. I still have those same error messages. 

 

This is an internal site so I am struggling to see how can I give you a live link to use. I dont think fiddles will work because I dont think fiddles allow you to use the xmlurl method with a file in your public folder. Do you have a suggestion how I can do that?

 

And thank you in advance for all of your help.   

Share this post

Link to post
Share on other sites

Ayan Bhadury   

Ayan Bhadury
Posted

Hi,

Could please tell me the steps to replicate the issue from the above URL so that I can investigate it further.

Please note I am able to see the chart by clicking all the options from the above-given URL.

Share this post

Link to post
Share on other sites

Ayan Bhadury   

Ayan Bhadury
Posted

 

14 hours ago, agustinm20 said:

I have similiar issue with Angular JS, the first load the chart is blank, when the page is reload work normally.

HI,

Please share me a sample or a live URL of the problem you are facing so that I can assist you accordingly.

Share this post

Link to post
Share on other sites

agustinm20   

agustinm20
Posted
On 17/5/2018 at 1:29 AM, Ayan Bhadury said:

 

HI,

Please share me a sample or a live URL of the problem you are facing so that I can assist you accordingly.

Can contact you in private mode? URL y login is not public.

Thanks!

Share this post

Link to post
Share on other sites

wwilliams   

wwilliams
Posted

Ayan, Thank you so much for your help on this issue. It has been resolved. I switched routing packages in Meteor to Flow-Router from Iron Router and that fixed it. While Meteor is full stack reactive,  Iron Router doesnt like to rerender anything if it doesnt have to. 

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
Go To Topic Listing Javascript Problems