Today I will focus my attention on tabs creation, since this is maybe the most common user interface component in a web application.
In order to create Closure tabs, we need to import the base js file (/goog/base.js) and then require the class goog.ui.TabPane. Inside our head (or body) we will get the following:
The main feature provided by the Google maps API, is the ability to convert an human readable location, such “Milan, Italy” to a geographic location represented by latitude and longitude, this process is called geocoding. The GClientGeocoder is the class which provide this service, through the method getLatLng() which accepts two arguments: a string representing an address and a callback function that will be called once the coordinates are retrieved. If the address will be successful located, the callback function will be invoked by passing a GLatLng object as argument, otherwise the function will receive a null. GLatLng is an object which represents a geographic location (latitude and longitude).
To request a geolocation for a given address we use a similar code:
Today we are going to see how to realize custom controls to add to our Google maps powered map.
The only concept that should be clear, in order to achive the goal, is what prototype is and why we must use it.
Preface: while I was writing I have been a little too verbose, so I won’t respect the previously declared steps, but I will add/modify them while posting.
In detail the site will be the official web page of an Italian bikers group, which will attempt to enter in the World Records Guinness as the largest bike aggregation of the same model (and I’ll be one of those crazy men! :-)))
The user will be able to subscribe to the event indicating his city and some other details.
And is here that the interactive map comes into play! It will shows the Italian map sprinkled by colored labels anchored to the main cities and indicating the total of subscribers in that city.
The label’s color will vary due to that number (green = few bikers, yellow = so so, red = many bikers).