Google Apps Hacks

334 GOOGLE APPS HACKS

...

<script type="text/javascript" src="default.js"></script>

<!--[if IE]><script type="text/javascript"

src="excanvas.js"></script><![endif]-->

</head>

...

Phew . . . you are now ready to open index.html in Internet Explorer, too.



Now that you know how to set up Canvas, even if only to draw a simple line, you’ve opened the door

to a whole universe of vector art! Let’s use this knowledge to visualize trafc data from Google

Analytics. Log in to one of your web site stats at http://analytics.google.com and choose Visitors→

Visitor Trending→Visits. Click the Export button and save the XML download as stats.xml.

You can open the XML le in your browser to have a look—it consists of, among other data, point

values showing visits for the last 30 days:

...

<Point>

<Value>29,430</Value>

<Label>January 29, 2008</Label>

</Point>

<Point>

<Value>24,058</Value>

<Label>January 30, 2008</Label>

</Point>

...

To load this XML le using JavaScript, you can use Ajax (Asynchronous JavaScript and XML, a

way for web pages to pull remote data without the need for a full page reload). At this point, after

changing the les, upload them to your server or run them on a server on your computer—like

WAMP, an Apache installation for Windows (http://wampserver.com)—so that the browser will grant

the script the rights to grab the XML le. This example won’t work if y ...