Great ! Thank you it works now ! I just removed the "()" and add the
callback parameter as you said.
Best,
Arnaud
On Wednesday, October 30, 2013 5:50:36 PM UTC+1, asgallant wrote:
>
> You'll need to reorganize your code a bit. First off, you don't want the
> "()" after "drawChart" when you call the google.setOnLoadCallback function,
> as that executes the drawChart function and passes the return value (null
> in your case) as the callback. This is the primary reason why you are
> getting those errors (the drawChart function is executing while the API is
> only partially loaded). Second, calling google.load from inside other
> functions is known to cause problems. Your best bet is to make your AJAX
> requests inside the callback from the google loader, and use the drawChart
> function as the callback from the AJAX:
>
> function drawChart () {
> var brandStatsAPI = "
> http://10.1.10.132:9990/getGoogleChartTable?brand_ids=5,15,100";;
> $.getJSON( brandStatsAPI, {
> after: "2013-01-01",
> before: "2014-04-30"
> })
> .done(function (jsonData) {
> console.log(jsonData);
> var data = google.visualization.arrayToDataTable(jsonData);
> console.log(data);
> var options = {
> title: 'Brands presence'
> };
> var chart = new
> google.visualization.LineChart(document.getElementById('chart_div'));
> chart.draw(data, options);
> })
> .fail(function( jqxhr, textStatus, error ) {
> var err = textStatus + ", " + error + jqxhr;
> console.log( "Request Failed: " + err );
> console.log(jqxhr);
> });
> }
> google.load("visualization", "1", {packages:["corechart"], callback:
> drawChart});
>
> On Wednesday, October 30, 2013 12:36:50 PM UTC-4, Arnaud Lamy wrote:
>>
>> Hi Guys,
>>
>> Here's my code:
>>
>> --------
>>
>> <!doctype html>
>> <html lang="en">
>> <head>
>> <meta charset="utf-8">
>> <title>Brand Monitoring stats</title>
>> <script type="text/javascript" src="https://www.google.com/jsapi
>> "></script>
>> <script src="http://code.jquery.com/jquery-1.9.1.js";></script>
>> <script type="text/javascript">
>> (function() {
>> var brandStatsAPI = "
>> http://10.1.10.132:9990/getGoogleChartTable?brand_ids=5,15,100";;
>> $.getJSON( brandStatsAPI, {
>> after: "2013-01-01",
>> before: "2014-04-30"
>> })
>> .done(function( jsonData ) {
>> google.load("visualization", "1", {packages:["corechart"]});
>> google.setOnLoadCallback(drawChart());
>> function drawChart() {
>> console.log(jsonData);
>> var data = google.visualization.arrayToDataTable(jsonData);
>> console.log(data);
>> var options = {
>> title: 'Brands presence'
>> };
>> var chart = new
>> google.visualization.LineChart(document.getElementById('chart_div'));
>> chart.draw(data, options);
>> }
>> })
>> .fail(function( jqxhr, textStatus, error ) {
>> var err = textStatus + ", " + error + jqxhr;
>> console.log( "Request Failed: " + err );
>> console.log(jqxhr);
>> });
>> })();
>> </script>
>> </head>
>> <body>
>> <div id="chart_div" style="width: 900px; height: 500px;"></div>
>> </body>
>> </html>
>>
>> --------
>>
>> Here's what I got in my console:
>>
>> Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2],
>> Array[2], Array[2], Array[2], Array[2], Array[2], Array[2], Array[2],
>> Array[2], Array[2], Array[2], Array[2]]
>> index.html:19
>> V {Mb: "0.6", H: Array[2], J: Array[17], ab: null, Ma: Array[0]…}
>> index.html:21
>>
>> 1. Uncaught Error: Container is not defined
>>
>> format+en,default,corechart.I.js:907<https://www.google.com/uds/api/visualization/1.0/d780f2951a73e815f003b2b487c1d0a3/format+en,default,corechart.I.js>
>> 1.
>> NCformat+en,default,corechart.I.js:907<https://www.google.com/uds/api/visualization/1.0/d780f2951a73e815f003b2b487c1d0a3/format+en,default,corechart.I.js>
>> 2.
>> SCformat+en,default,corechart.I.js:908<https://www.google.com/uds/api/visualization/1.0/d780f2951a73e815f003b2b487c1d0a3/format+en,default,corechart.I.js>
>> 3.
>> bDformat+en,default,corechart.I.js:915<https://www.google.com/uds/api/visualization/1.0/d780f2951a73e815f003b2b487c1d0a3/format+en,default,corechart.I.js>
>> 4. drawChartindex.html:25
>> 5. (anonymous function)index.html:17
>> 6. firejquery-1.9.1.js:1037<http://code.jquery.com/jquery-1.9.1.js>
>> 7.
>> self.fireWithjquery-1.9.1.js:1148<http://code.jquery.com/jquery-1.9.1.js>
>> 8. donejquery-1.9.1.js:8074<http://code.jquery.com/jquery-1.9.1.js>
>> 9. callback
>>
>>
>> I tried to move "google.load("visualization", "1",
>> {packages:["corechart"]}); google.setOnLoadCallback(drawChart());" to the
>> top but doesn't work neither (drawChart doesn't declared). Have you any
>> idea how I can do that ?
>>
>> My use case is pretty simple, load a formatted json for google char and
>> load it inside a line graph ! :)
>>
>> Best,
>> Arnaud
>>
>
--
You received this message because you are subscribed to the Google Groups
"Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/google-visualization-api.
For more options, visit https://groups.google.com/groups/opt_out.
