jQuery Google gMap Plugin

I think with the growing trend and movement towards geolocation based services, like on Twitter, and Foursquare google maps applications are going to need to be geolocation specific. What this means is that there may need to be some rewriting of some older maps or it could just be a chance to refactor and upgrade, at what would seem an ideal time considering some of the utilities and libraries available.

Now when you are looking for a plugin or functionality from a library your needs have grown or may be more specific. For example having the ability to dynamically populate and remove custom markers, or even for performing transitions on the map.

Welcome the gMaps plugin

Plugin Name: jQuery gMaps Plugin

Plugin URL: http://gmap.nurtext.de/

Demo: Plugin Demo

Docs: Plugin Documentation

When it comes to describing a plugin or platform, i find it is often best to give the official description before i give my evaluation. If you go over here you can see it is described as:

gMap is a lightweight jQuery plugin that helps you embed Google Maps into your website. With only 2 KB in size it is very flexible and highly customizable. – gmap.nurtext.de/

Sample Code

When looking at a plugin its always good to see what it takes to actually get it working? Do you need a PHD to go in and decipher it or do you simply need to make a easy call to a function and easily add parameters.

Lets take the code for the example below:

$("#gMap").gMap({ markers: [{ latitude: 47.660937,
longitude: 9.569803,
html: "Tettnang, Germany",
popup: true }] });

Verdict

Now if anyone has ever had to do this they will tell you that what ends up happening is one of two things.

  1. You find a js library to make this less painful
  2. You decide to venture on your own and write painful mix of code

The plugin is really sounds, and minus a sticky point or two is really a good option when comparing the available options.

Pros

  1. Lightweight and compact.
  2. Fast.
  3. Simple API interface.
  4. Easily add custom icons and markers.
  5. jQuery 1.4 compaitble.
  6. Developer is Google Map API 3 aware.

Cons

  1. Unfortunately for now it will only take longditute and latitude but i believe that the developers are working on this.

Summary

The fact that the documentaion is very thorough and has plenty of examples means that you can spend more time getting your application to do what you need it to do rather than trying to learn the intricacies of some confusing plugin.

It also solves the problem of having to write extremely blended code with the google maps jQuery API, and that is always a plus are more time can be spent on development.

The gMap plugin itself takes the list of available parameters as a JSON object and pass it into the gMap() function, which means you can put in fairly complex information in an easy-to-read and understand, structured format. This is also a bonus as as you get a very extensive list of parameters from the google maps API you can access. Add this to the fact that the developers seem to be keeping track of the Google Maps 3 status upgrading should be a fairly painless process one hopes.

Most importantly when you use this plugin in conjuction with a free service Geonames, you can start to see how you can have geo-specific content for your users. Overall though this was a pretty good showing and worth a try.

Further Reading (External Links)

  1. jQuery Google Maps Tutorial Basics
  2. Google Maps the jQuery Plugin Way
  3. jQuery and Google Maps
  4. jQuery GPS plugin
  5. jQuery and Google Maps Tutorial using ajax
ass a JSON object to the gMap() functiothn
  • Pixels and Beats

    This one breaks when you start feeding it a number of locations to geocode :(

    It shows some but not all, and the ones it does show seem fairly random.

    Myself and others have confirmed this.

    • timani

      I haven’t tried it much in a while, but i think i saw the same issue

  • JTK

    You can also use gmap3, it allow to manipulate google map v3

    http://night-coder.com/jquery-plugin-gmap3.html
    http://plugins.jquery.com/project/gmap3

    JTK