2005-11-23

Google Analytics Hack


Recently Google has lunch new service
Google Analytics, a free web analyzer. I like the design on showing its stats,
show in chart, with flash make it more interest. Unfortunately, it’s cannot show up in the Firefox 1.5, but in IE it's run correctly.
We can use its flash movie for our website, its very simple, the flash movie load the data from the flashVars variable that we given into object tag.
To using the flash movie here the steps:

1. Download the flash movie from google analytic site


https://www.google.com/analytics/home/uflash/UrchinGraphMini.swf
https://www.google.com/analytics/home/uflash/UrchinGraph.swf
https://www.google.com/analytics/home/uflash/UrchinGraphMap.swf
https://www.google.com/analytics/home/uflash/UrchinGraphMapMini.swf
there are 2 kind graph, a common graph (bar, line) and the map overlay that mapping the data into map,
each kind has the normal size and the mini one

2. Insert flash movie into your page using object tag, you can use hotlink into flash movie on Google analytics site



<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" style="" codebase="https://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0"
id="UrchinGraph3" align="middle" height="225" width="350" />
<param name="allowScriptAccess" value="sameDomain"/>
<param name="movie" value="UrchinGraphMini.swf" />
<param name="quality" value="high"/>
<param name="bgcolor" value="#ffffff"/>
<param name="wmode" value="transparent"/>
<embed style="visibility: hidden ! important;" adblockframename="adblock-frame-n9"
adblockframedobject2="true" src="UrchinGraphMini.swf" quality="high" bgcolor="#ffffff"
name="UrchinGraph"
wmode="transparent" allowscriptaccess="sameDomain" type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer"
flashvars="ntitle=Sources&amp;toggle=Show%20All|Hide%20All&vtitle=Visits&amp;cnames=&amp;datatype=20&amp;rtitle=Visits by Source&amp;fsize=0&amp;gtypes=pie&amp;total=1254&amp;uloc=us|$|0|2&amp;xdata=google\t901\n(direct)\t211\nyahoo\t84\ngoogle.co.id\t9\nmsn\t8\n" align="middle" height="225" width="350" />


3. Insert the flashvars, there two option to include the flashvars, for IE and non IE.


For IE the flashvars insert into tag object with tag param as new key, and for non IE: insert the flashVars into tag embed as new attribute.
On IE
<param name="flashvars" value=""/>
and non IE
<embed flashvars="..data.."/>

flashvars Format and Variables


we given variables into flash movie with these rule:
each variable separate with string &ampl (a escape symbol for &)

var1=value1&amp;vars2=value2


The variables to control the urchinGraph such
gtypes : graph type, you can use multiple type, the type of graph are: line, bar, mline (multi line), pie, fun, hbar (horizontal bar)
xdata : data itself, the format: each rows separate by \n and each column separate by \t
toptitle : top title of graph
rtitle: sub title of grpah
ntitle: x-axis title
vtitle: vertical title, the y-axis title
vtitle2: vertical title, the 2nd y-axis title place on right side of graph
cname: columns name

4 comments:

Anonymous said...

cuman mau koreksi dikit mas, linknya salah harusnya www.google.com/analytics/ bukan di www.google.com/analitycs/

Anonymous said...

How can I hack the UrchinGraphMap.swf and pass my own values. Any help on this is much appreciated. Jehangir99@hotmail.com

Gaines Kergosien said...

I was hoping to display the map overlay on my website with the visitors plotted just like it is in my Google Analytics report, but I got lost in the js files trying to figure out how to retrieve and pass in the data.

If someone figures this out, please let me know! :)

Anonymous said...

Keep up this fantastic content, went ahead and added to my firefox rss.