How to include Google charts API without calling google.load()?
Asked Answered
P

2

7

The jQuery, jQuery UI and Google Maps can be loaded from Google's CDN in two ways - either by using google.load():

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1");
google.load("jqueryui", "1");
google.load("maps", "3", {other_params: "language=de&sensor=false"});
</script>

or by using the static <script src="..."> tags:

<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false&language=de"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>

Is there please the 2nd way available for the Google charts API as well?

For me only this method works:

<script type="text/javascript">
google.load('visualization', '1.0', {'packages':['corechart']});
</script>

but I can not find the URL for the 2nd way.

And I would prefer to include the Google charts API statically because it looks more straightforward to me and because of my current problem with DataTables.net.

When I look at the resources using the Google Chrome console, I can see the address like

https://www.google.com/uds/api/visualization/1.0/342b7b8453344477d252440b6c1305c9/format+en,default,corechart.I.js

but I think it is a temporary one, which can expire...

Polystyrene answered 31/3, 2012 at 16:34 Comment(1)
This worked for me <script type="text/javascript" src="uds_api_contents.js"></script> and yeah you can get that file from here gist.githubusercontent.com/makevoid/3999915/raw/… Include this file after jsapi.Barbosa
P
16

I've found an autoloading workaround:

<script type="text/javascript" 
src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart'],'language':'ru'}]}">
</script>

UPDATE 2017:

Chrome displays this warning though:

jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart','table'],'…:22 A Parser-blocking, cross-origin script, https://www.google.com/uds/api/visualization/1.0/84dc8f392c72d48b78b72f8a2e79c1a1/format+ru,default+ru,ui+ru,table+ru,corechart+ru.I.js, is invoked via document.write. This may be blocked by the browser if the device has poor network connectivity. See https://www.chromestatus.com/feature/5718547946799104 for more details. google.loader.f @ jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart','table'],'…:22 (anonymous) @ jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart','table'],'…:54

Polystyrene answered 21/4, 2012 at 14:5 Comment(1)
@Alexander Farber:-What if i am using this:-google.charts.load('current', { 'packages': ['corechart', 'annotationchart', 'calendar', 'gantt', 'gauge', 'map', 'orgchart', 'sankey', 'timeline', 'treemap', 'wordtree'] });. How to write same line of code for loader.js ?Ambitious
S
2

I was trying to find this out as well - all of my searching indicates that there is no way of direct linking the charts API (which is a shame). I eventually ended up using the image charts API instead: https://developers.google.com/chart/image/

Schmo answered 7/4, 2012 at 3:20 Comment(1)
I use Image Charts myself (see #10053427 ) but I suspect they will be discontinued soon (Google has been quick to do that for some recent products), so I'd like to move up.Polystyrene

© 2022 - 2024 — McMap. All rights reserved.