Google Analytics; using custom variables with even

Question

I've been tasked with adding some Google Analytics events to a web site. I've never used Google Analytics before, and I have the basics working, but despite having read lots of documentation I don't really understand how/if custom variables apply to events.

For example, I have code like this when the user clicks a button to view information about a flight:

    var scope = 3; // page-level scope
    _gaq.push(['_setCustomVar', 1, 'FlightNumber', FlightNumber, scope]);
    _gaq.push(['_setCustomVar', 2, 'Departure', Departure, scope]);
    _gaq.push(['_setCustomVar', 3, 'Destination', Destination, scope]);
    _gaq.push(['_setCustomVar', 4, 'Destination', ETD, scope]);
    var detail = FlightNumber + ": " + Departure + " => " + Destination + "@" + ETD;
    _gaq.push(['_trackEvent', 'Flight', 'View', detail]);

If I run Chrome with the Google Analytics Debugger extension running, I can see that these custom variables seem to be getting set and a tracking beacon is sent.

But when I visit the Analytics page, I can't find anything that shows these custom variables, although the detail information in the label field of the event is right.

Are the variables (as I hope) somehow related to the event, or have I mis-understood how they work? If the latter, how can I analyse the events based on the various parameters such as departure, flight number, etc?

Am I doing the right thing by using page scope? It seems to me the correct thing, because each event (which is analogous to a page visit) can have different departure/destination/etc.

If the code is right, how do I see the data on the Analytics page? For example, how can I see how many flights from a particular departure airport were viewed?

On a related note, I see a problem with the ETD (Estimated Time of Departure) variable - the original ETD variable has a value such as "Wed May 01 2013 12:50:00 GMT+0100 (GMT Daylight Time)", and I can see in the debugging output that the custom variable is set:

    _gaq.push processing "_setCustomVar" for args: "[4,ETD,Wed May 01 2013 12:50:00 GMT+0100 (GMT Daylight Time),3]":  

However the subsequent debugging output that (I think) decodes the tracking event beacon shows this:

    Custom Var 4             : label:'ETD' value:'undefined' scope:'Page'

What's the problem there? Why has my custom variable's value not been set correctly?

Answer 1

1) Officially, data can take up to 24 hours to show up in GA, so if you are clicking the button and then immediately going to GA to see if it shows up, you're not waiting long enough. You can't officially start worrying for at least 24 hours.

2) You only have 5 custom variable slots, and depending on how you use a given custom variable slot, particularly the scope argument, you may be overwriting your data. Are you using custom variables somewhere else, and what scope are you using for them elsewhere?

3) "why is my custom variable not being set correctly?" I assume you mean that it is showing "undefined".. well that is because the javascript variable you are passing as an argument to GA is undefined; that's not a problem with your GA code, that's a problem with wherever you are (not) defining that javascript variable.