Google Maps Integration

Our client, an Italy based travel agency, wanted to integrate a hotel location map system with their existing website. The aim was to enable users to easily locate various hotels thereby enhancing the users’ browsing experience. As per their requirements Open Source Development implemented the Google Maps API with their existing website thereby enabling travellers to locate hotels (registered with the client's network) on Google Maps and obtain directions to the same. The client has tied up with Open Source Development for all their technology requirements, the first phase of which was the integration of Google Maps with their website.

Customer Profile
Our client, a travel agent and tour operator based out of Italy, offers business and leisure holidays to travellers. Hotels and travel agents, across Europe, can register with them to be a part of their network. Through their website, the client offers their customers online reservations in any of the hotels within their network.

Business Requirements
Our client had a Java based hotel location map system integrated with their website, which they wanted to upgrade in order to provide enhanced map navigation functionalities to travellers using their website to locate and book hotels. They wanted to integrate Google Maps with their website in order to make use of and take advantage of its wide array of features and functionalities and required Google Maps to be implemented in the following areas within the website:

• Back-office: In order to enable administrators to locate and set hotel location coordinates on the maps and assign them to individual hotels.

• Main Website: To enable travellers to view the all hotels marked on the visible part of the map. As the users navigate on the map, hotels are marked and displayed for the new locations.

• Individual Hotel websites: To enable travellers to view an enlarged map for the selected hotel and retrieve directions to the same, from desired locations/destinations.

Integration of Google Maps API
After a detailed study of the Google Maps API, Open Source Development implemented and integrated Google Maps with the client’s travel website.

Google Maps, empowers users with controls to zoom in, zoom out, change pan direction (left, right, up and down), enlarge and reduce map size. The Maps can also be navigated by clicking and dragging the mouse. All maps can be viewed as street maps, satellite imagery or a combination of satellite imagery with street names.

We embedded Google Maps and implemented its functionalities within the following areas of the website:

Back-office
Administrators can use the embedded Google Maps to locate individual hotels and save their latitude and longitude coordinates. If the location coordinates for a hotel have been saved, the map is centered to the hotel; otherwise the map is centered to the default destination i.e. Europe.

Administrators can locate the hotel based on the address; the latitude and longitude are set accordingly. They can set the zoom level at which the map will be displayed on the individual hotel pages thereby enabling them to enhance the visibility and prominence of their hotels.

Main Website
Travellers can view a street map of the selected destination marked with all the hotels available. The hotels are marked on the map on the basis of the location coordinates stored, for each hotel, through the back-office application. Travellers can click the hotel icons on the map to view a brief description, image and web links for the hotel.

In order to display the hotel details on the map, we fetch (from the database) and store the relevant information, of only those hotels that are to be displayed in the visible parts of the map thereby enabling faster map rendering and less visual clutter, in an XML file. As and when the user navigates on the map, fresh hotel data is fetched and stored in the XML. This file is passed to the Google Maps API where it is interpreted and displayed on the map.

Hotel website
Travellers can view the location map, displayed on the basis of location coordinates, for the selected hotel. The map is displayed at the pre-defined zoom level (set by the administrator) and is centered to the hotel location. Travellers can get route directions from desired destinations to the hotel. The route is displayed as a poly line on the map. Provisions to reverse the directions have also been provided.

Technologies used in developing this application are:

                    


Summary
With the integration of Google Maps, Open Source Development enabled the client to provide travellers with extensive and detailed hotel location maps. Google Maps implemented at the back-end enables administrators assign location maps to hotels and at the front end enables travellers to locate and get step by step directions to the same.