Tuesday, March 18, 2008

I recently put my latest creation online, a mashup of Seattle area restaurant health inspections www.safefoodfinder.com. This mashup uses Google Maps API with the ExtJS Javascript library to provide some UI elements including a nice layout with tabbed/collapsible side bars, an auto-complete search box, and a tabbed main window. Adding simple dialog boxes is also very easy. The tabbed main window is a great way to show more information about a marker than will fit in a reasonably-sized pop-up bubble. I've seen some mashups that link from a bubble to an external site. The problem with that is that the entire Google Map needs to re-load when the user comes back from the link.

The primary down-side to this approach is the large size of the ExtJS library. I've tried to mitigate this by creating a package of only the needed parts of the library and tagging it for caching (YSlow is a great tool). I've also found that the tabbed interface confuses some users. They don't immediately realize how to get back to the main map tab. Hitting back will leave the site completely. ExtJS doesn't provide any history handling yet, although I know other libraries like YUI will intercept the back button and display a previous tab.

In the spirit of open cooperation, I've provided the non-minified Javascript code for the site at http://www.safefoodfinder.com/map-debug.js. I think it's a fairly decent example of object-oriented Javascript.

I know Google announced a while back a partnership with CleanScores to provide inspection data with restaurant reviews, but I thought it would be worthwhile to have a map that concentrates on health inspections.

I also modified my prior web site www.runwayfinder.com, a pre-flight planning tool for pilots, to use ExtJS. It shows how the dialog box works. When a user first visits the site, a modal dialog pops up displaying recent news about the site.

Labels:

3 Comments:

Blogger m said...

that's a very attractive layout! it looks a lot like the new metacarta (http://geosearch.metacarta.com) which i thought was so attractive! i will definately take a look at your code!

March 28, 2008 at 6:54 AM  
Blogger Sahmeepee said...

I came to your new site via a post you made on the gmaps api group and I must say I'm very impressed with the aesthetics, the usability and the speed.

I was very surprised at the depth of information you provided. It would be interesting to know what kind of raw data you were dealing with (e.g. were all the latlongs already with the records for each site)

Anyway, very good job!

March 28, 2008 at 9:02 PM  
Blogger Unknown said...

u have a very nice post..for more please visit seo services india,seo company india

August 30, 2012 at 11:45 PM  

Post a Comment

Subscribe to Post Comments [Atom]

<< Home