google.visualization is undefined

[Dan Prince]

Hi there! I have just started learning javascript and to further my
knowledge I have decided to try writing a simple library for some of
the Google Visualization methods. Everything was working smoothly up
until the point where I referenced 'google.visualization' in the line

new
google.visualization.LineChart(document.getElementById(myChart.elementid))

(myChart.elementid is a seperate chart class with property elementid
which is an element on the page)

Firebug was throwing up the error "google.visualization is undefined".
I put some breakpoints in and went through the code to see where it
had failed and it pointed towards the line with the code new
google.visualization.LineChart(document.getElementById(myChart.elementid))

The HTML page that I am using to debug the library has included the
library js file and the google JS api file. Both of these are
correctly refrenced as the methods are carried out. Also inside the
library is a line, which seems to work.

google.load('visualization', '1', {packages: ['corechart']});

I really have no idea what is going wrong here, I don't even know
whether what I am trying to do is possible! Any advice or alternative
solutions would be greatly appreciated.

Cheers in advance!

Dan

[NA]

Are you using the google.setOnLoadCallback() method to call the
function containing the call to LineChart()? You need to do that,
otherwise LineChart() gets called before the google library is loaded.

[Dan Prince]

Ok, cheers for the reply. The function it is calling is this:

function loadPackages(type)
{
switch(type)
{
case 'line':

google.load('visualization', '1', {packages: ['corechart']});

chart = new
google.visualization.LineChart(document.getElementById(myChart.type));
writeDebug('You have loaded the specific Google packages.');
return true;

default:
writeError('We could not find a package for the chart type <b><i>
'+type+' </b></i>. Check that you referenced it correctly.');break;
return false;
}
}

and it being called in the line

if (google.setOnLoadCallback(loadPackages(myChart.type)))

I am still getting the google.visualization is undefined error. Am I
using the setOnLoadCallback correctly?

Cheers

[asgallant]

I don't think you can load the API from inside setOnLoadCallback...that seems rather counterintuitive to me anyway (when the API is done loading, load the API?).  It is typically used more like this:

google.load('visualization', '1', {packages: ['corechart']});

google.setOnLoadCallback(drawChart);

function drawChart() {

// create data table, create chart, draw chart

}

if you need to pass parameters to your drawing function, you can add an intermediary function:

google.setOnLoadCallback(init);

function init() {

     drawChart(<params>);

}

[NA]

You had:

if (google.setOnLoadCallback(loadPackages(myChart.type))

You need to pass setOnLoadCallback a function object. In your case,
you're actually calling the function, not passing a function object.
So what happens is that:

1) loadPackages(myChart.type) is executed
2) the output of that function call is passed to setOnLoadCallback

That's not what you want to do. You want to pass the function
instead. So you should do:

google.setOnLoadCallback(loadPackages);

Here, we aren't actually calling the loadPackages function. We are
just referring to it by its name.

Also, is all this because you had difficulty loading multiple packages
at once? This was just a typo you were making. I responded to your
thread about that here:

http://groups.google.com/group/google-visualization-api/browse_thread/thread/652dadad56cfee6f#

Personally, I just load all the packages I need and don't worry too
much about not using something. Much easier that way.

[Dan Prince]

Ok...
Asgallant - I want to be able to import the correct packages for the
type of chart specified by the user, whether that be corechart or
table, whatever. I don't see how using setOnLoadCallback(drawChart);
rather than setOnLoadCallback(loadPackages); will make any difference
to whether google.visualization is defined or not, the only thing that
is changing is the name of the function. On a side note, why would you
use an intermediary function rather than specifying parameters inside
the draw function?

NA - Ok, so if I use google.setOnLoadCallback(loadPackages); when can
I call the function loadPackages with the parameters to return the
boolean value? Also, that other thread is by someone else. Just to
check that I have got it correct though, the HTML page that I am using
to test functionality of this library has two script tags. The first
is the JS API from google and the second is the library that I am
writing. Will the library be able to call functions from JS API like
this?

I appreciate the help guys! Cheers,

Dan

On Jul 20, 9:04 pm, NA <nabeel.a...@gmail.com> wrote:
> You had:
>
> if (google.setOnLoadCallback(loadPackages(myChart.type))
>
> You need to pass setOnLoadCallback a function object.  In your case,
> you're actually calling the function, not passing a function object.
> So what happens is that:
>
> 1) loadPackages(myChart.type) is executed
> 2) the output of that function call is passed to setOnLoadCallback
>
> That's not what you want to do.  You want to pass the function
> instead.  So you should do:
>
> google.setOnLoadCallback(loadPackages);
>
> Here, we aren't actually calling the loadPackages function. We are
> just referring to it by its name.
>
> Also, is all this because you had difficulty loading multiple packages
> at once?  This was just a typo you were making.  I responded to your
> thread about that here:
>

>  http://groups.google.com/group/google-visualization-api/browse_thread...

[NA]

You *don't* call the function that you pass to setOnLoadCallback.
That's the whole point. :) That function is called automatically
when the google packages finish loading. It is called without any
input parameters.

Try taking the examples in the API playground and working with them
and you'll see how it works.

best,

[asgallant]

I don't think you can load packages inside setOnLoadCallback.  Until you have loaded a package, setOnLoadCallback doesn't trigger, but you don't load a package until setOnLoadCallback triggers...neither event ever occurs.  Just to be sure, I gave it a try on the viz playground, and it doesn't work.  You have to load the packages before calling setOnLoadCallback.

The reason you would use an intermediary function in setOnLoadCallback is because the callback takes a function object as a parameter, not a function call.  You can't pass arguments to the function with the object.

This fails:

google.setOnLoadCallback(foo(bar));

This succeeds:

google.setOnLoadCallback(baz);

function baz() {

     foo(bar);

}

If it so happens that foo(bar); returns a function object, I suppose you could use the first method, but that would be the only exception to the rule.