Rendering javascript in template on initial page load meteorjs

Question

I'm trying to load a chart from the google charts api. For the most part it is working as planned. The issue comes on the initial page load. If I navigate from another part of my site to the page (using router) it loads fine. However, if I hit the refresh button on the page the chart does not load until I leave and re-enter the page.

I have this in my main.html header:

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

and in my template.templatename.rendered AND template.templatename.created I have

google.load("visualization", "1", {'callback':function() {},packages:["corechart"]});
google.setOnLoadCallback(drawChart);
Deps.autorun(function () { 
             drawChart()
             })

Where drawChart() calls the google visualization commands. I do understand I'm probably calling some repetitive code currently, but all of this is in an effort to get the page to load when I hit refresh.

I appreciate any help.

Please let me know if there is any more info needed. Thanks.

And router should have after callbacks that you can put your drawChart() In there — crapthings
– crapthings, Commented Sep 29, 2013 at 4:56

Dave Alperovich · Accepted Answer · 2013-12-19 23:03:11Z

1

Placing the Google jsapi file in the main.html header will cause the browser to run the Javascript after the DOM is completely loaded, which is too late for your purposes.

Meteor is calling your google.load code before the DOM is completely rendered, so when you hit refresh page, the jsapi file is undefined when Meteor calls google.load.

However, if you navigate away and then back, the DOM has already been loaded once, so the chart will be rendered correctly.

To solve this, I would suggest just saving a local version of http://www.google.com/jsapi in your client folder.

Thus, Meteor will load it before it calls the google.load code.

edited Dec 19, 2013 at 23:03

Dave Alperovich

32.6k8 gold badges82 silver badges101 bronze badges

answered Dec 19, 2013 at 22:43

justswim

9639 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Rendering javascript in template on initial page load meteorjs

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related