// ---------------------------------------------------------------------------------------------------
// GOOGLEMAPS JAVASCRIPT WRAPPER
// ---------------------------------------------------------------------------------------------------
// Author : D. Barsotti
// Date : 11.2008
// ---------------------------------------------------------------------------------------------------
//
// This script defines a wrapper javascript object to the GoogleMap API.
//
//
// Example of usage:
//
//
//
//
//
//
//
//
//
//
//
//
//
//
// ---------------------------------------------------------------------------------------------------
// Constructor of the GoogleMap Wrapper
//
// @contructor
// @param {id} : ID of the HTML DIV that will contain the map
// @param {redirect_function} : The function called when the user double clicks on a marker
function KMap(id, redirect_function) {
this._map = null;
this._div_id = id;
this._redirect_function = redirect_function;
if (GBrowserIsCompatible()) {
this._map = new GMap2(document.getElementById(id));
}
else {
alert("Sorry, GoogleMap is not compatible with this browser");
}
}
// Set the center and the zoom of the map
//
// @param {lat} : Latitude of the central point
// @param {lng} : Longitude of the central point
// @param {zoom} : Zoom factor
KMap.prototype.setCenter = function(lat, lng, zoom) {
this._map.setCenter(new GLatLng(lat, lng), zoom);
}
KMap.prototype.setMapType = function(type) {
this._map.setMapType(type);
}
// Create a simple marker on the map. The marker will have a default info text window.
//
// @param {lat} : Latitude of the marker
// @param {lng} : Longitude of the marker
// @param {icon} : A GIcon object representing the image to be used as marker (null to use the default).
// @param {info_text} : The (html) text to be used in the info text displayed when the mouse is over the marker.
// @return {GMarker} : A reference on the just created marker
// @remarks : You may use KMap.getIcon to create an icon based on the URL of the image to be used.
KMap.prototype.createSimpleMarker = function(lat, lng, icon, info_text) {
var point = new GLatLng(lat, lng);
var marker = new GMarker(point, icon);
this._map.addOverlay(marker);
GEvent.addListener(marker, 'mouseover', function() { marker.openInfoWindow(info_text); });
GEvent.addListener(marker, 'mouseout', function() { marker.closeInfoWindow(); });
return marker;
}
// Create a customized marker on the map. The marker will use a special rectangular area to display info texts.
//
// @param {lat} : Latitude of the marker
// @param {lng} : Longitude of the marker
// @param {icon} : A GIcon object representing the image to be used as marker (null to use the default).
// @param {info_text} : The (html) text to be used in the info text displayed when the mouse is over the marker.
// @param {redirect_url} : The URL to which the user will be redirected when he double clicks on a marker.
// @return {GMarker} : A reference on the just created marker
// @remarks : You may use KMap.getIcon to create an icon based on the URL of the image to be used.
// @remarks : In order to work this routine requires you to include extinfowindow.css and extinfowindow.js.
KMap.prototype.createAdvancedMarker = function(lat, lng, icon, info_html, redirect_url) {
var point = new GLatLng(lat, lng);
var marker = new GMarker(point, icon);
var map = this._map;
var redirect_function = this._redirect_function;
this._map.addOverlay(marker);
GEvent.addListener(marker, 'mouseover', function() {
marker.openExtInfoWindow(map, 'simple_example_window', info_html, { beakOffset: 3 });
});
GEvent.addListener(marker, 'mouseout', function() {
marker.closeExtInfoWindow(map);
});
GEvent.addListener(marker, 'click', function() {
redirect_function(redirect_url);
});
// GEvent.addListener(marker, 'dblclick', function() {
// redirect_function(redirect_url);
// });
return marker;
}
// Attach an event handler to a marker
//
// @param {marker} : A reference to the marker
// @param {event} : The name of the event to handle (ex. click, dblclick, mouseover, mouseout, ...)
// @param {listener} : A function that will handle the event
KMap.prototype.addMarkerListener = function(marker, event, listener) {
GEvent.addListener(marker, event, listener);
}
// Add a map control to the map
//
// @param {control} : A GControl to be added to the map
// @param {anchor} : The anchoring method of the control into the map (ex. G_ANCHOR_BOTTOM_LEFT)
// @param {width} : The width of the control
// @param {height} : The height of the control
KMap.prototype.addMapControl = function(control, anchor, width, height) {
this._map.addControl(control, new GControlPosition(anchor, new GSize(width, height)));
}
// Create a new GIcon object from the URL of an image. The size and anchor of the icon are hard coded in the routine (32 x 32)
//
// @param {src} : The URL of the image to use as icon
KMap.prototype.getIcon = function(src) {
var icon = new GIcon();
icon.image = src;
icon.iconSize = new GSize(32, 32);
icon.iconAnchor = new GPoint(16, 32);
icon.infoWindowAnchor = new GPoint(16, 0);
return icon;
}