Monday, October 25, 2010

Introducing Xtracked 2.0: Bigger, Better and more user-friendly than ever!

Since the Google Maps JavaScript API V2 has officially been deprecated, we decided to follow Google's example and completely rewrite all of our JavaScript code from scratch to support their new and improved Google Maps JavaScript API V3. Ofcourse we couldn't allow ourselves doing this without adding some cool new features along the way.

To start off with, we added the possibility to add personal notes to the dates you tracked your trips. We are planning on using this feature to allow you to not only select your tracks per date, but also by the description you gave them earlier.

Because Google's default markers and their InfoWindow simply didn't suffice for our cause, we had to come up with a solution of our own. Luckily the Google Maps API V3 supplied us with the tools we needed in the form of their MarkerImage and OverlayView classes. By implementing these, we are able to bring you the best mapping solution out there while staying faithfull to the Xtracked look and feel.

One feature we are all very keen about (and we know you have been waiting for) is Google Street View, allowing you to relive your trips through panoramic 360 degree views. Since we are a big fan of customizability, we leave it up to you whether to use Street View side-by-side with the map or as a standalone module.

Chart interaction has always been a very important aspect of the Xtracked website, but with the addition of Street View now more than ever. You will see that when hovering over the chart, not only is the map centered at your current location, but also does the Street View panorama reflect the actual view you had when passing that location (by setting its POV).

If you would want to find out more about a specific point, let's say it's address, the date and time you have been there or the speed at which you were travelling, than simply click the series in the chart and a popup with detailed information will appear on the map.

Zooming in is just as easy, just click, drag and release your mouse on a section of interest in the chart and the chart and map will automatically zoom in to the selected boundaries.

Last but not least, we even added the Google Maps 'More...' menu with a Xtracked twist, allowing you to overlay your map with the Traffic and Bicycle Layer and switch to Satellite, OpenStreetMap and CloudMade map tiles.

We could go on and on about how psyched we are about the Maps API V3 and our implementation of it, but we would rather have you take a look at it yourself and tell us what you think. Check out our live demo at, view the slides below or just browse through our online album.

No comments:

Post a Comment