Loading google packages programmatically

186 views
Skip to first unread message

Coelho Net

unread,
Jul 16, 2011, 12:45:11 PM7/16/11
to google-visua...@googlegroups.com
I have two pages, the main.html and the maps.html.

The main.html has a menu that when the user click a jquery function loads the maps.html inside a div on main.html content area.

I want to reduce the initial page load time calling all the google packages only when the user clicks to open maps.html

I have put all the google loading code directly in the maps.html but when you try to open it from main.html nothing happens (opening map.html directly works fine).
This problem occurs with other packages like table and geomap

The only solution that I have found is loading maps.html inside a iframe on main.html.

Looks like if I try to load any google package programmatically it does not work, it only works if you load it with the 
initialization code outside a function.

Is there any way to load google packages programmatically after the main page has been loaded?

I have annexed two sample pages to show the problem.
main.html
maps.html

Jinji

unread,
Jul 18, 2011, 11:08:09 AM7/18/11
to google-visua...@googlegroups.com
--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/o_V1ecQaDq8J.
To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

Coelho Net

unread,
Jul 19, 2011, 2:09:29 PM7/19/11
to google-visua...@googlegroups.com
Solved

Observations:

I was trying to load all packages together but you need to load every package independently:
                    google.load('visualization', '1', { packages: ['intensitymap'], "callback": myCallBack});
                    google.load('visualization', '1', { packages: ['table'], "callback": myCallBack });
                    google.load('visualization', '1', { packages: ['geomap'], "callback": myCallBack });                    

This does not worked very well:
                    google.load('visualization', '1', { packages: ['intensitymap,table,geomap'], "callback": myCallBack });

And the callback must be a function without parameters. 
I was trying to use a callback function with parameters, the function gets called normally but the package fails to load...

Thanks

NA

unread,
Jul 19, 2011, 2:15:10 PM7/19/11
to Google Visualization API
You need to give it an array of strings, not a single string with
comma separated elements. So instead of

google.load('visualization', '1', { packages:
['intensitymap,table,geomap'], "callback": myCallBack });

Try:

google.load('visualization', '1', { packages:
['intensitymap','table','geomap'], "callback": myCallBack });

Each element in the array is a string (in this case, the packages
array has length 3).

That should fix the problem.

hope that helped,

-- N



Reply all
Reply to author
Forward
0 new messages