Created
March 10, 2011 04:54
-
-
Save fatgy/863588 to your computer and use it in GitHub Desktop.
Esa's Google Maps API v3 experiments. Circle overlay as a marker.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// http://koti.mbnet.fi/ojalesa/boundsbox/makemarker_circle.htm | |
/** | |
* makeMarker() ver 0.3 | |
* creates Marker and InfoWindow on a Map() named 'map' | |
* now creates alternatively a Circle if 'radius' option property is given | |
* creates sidebar row in a DIV 'sidebar' | |
* saves marker to markerArray and markerBounds | |
* @param options object for Marker, InfoWindow and SidebarItem | |
* @author Esa 2009, 2010 | |
*/ | |
var infoWindow = new google.maps.InfoWindow(); | |
var markerBounds = new google.maps.LatLngBounds(); | |
var markerArray = []; | |
var pointsArray = []; // new in v0.3 For simple polyline construction. | |
function makeMarker(options){ | |
options.center = options.center || options.position; | |
if (options.radius) var pushPin = new google.maps.Circle({map:map}); | |
else var pushPin = new google.maps.Marker({map:map}); | |
pushPin.setOptions(options); | |
google.maps.event.addListener(pushPin, "click", function(){ | |
infoWindow.setOptions(options); | |
infoWindow.open(map, pushPin); | |
if(this.sidebarButton)this.sidebarButton.button.focus(); | |
}); | |
if (options.sidebarItem){ | |
pushPin.sidebarButton = new SidebarItem(pushPin, options); | |
pushPin.sidebarButton.addIn("sidebar"); | |
} | |
markerBounds.extend(options.position); | |
markerArray.push(pushPin); | |
pointsArray.push(options.center); | |
return pushPin; | |
} | |
google.maps.event.addListener(map, "click", function(){ | |
infoWindow.close(); | |
}); | |
/** | |
* Creates a sidebar item | |
* @constructor | |
* @author Esa 2009 | |
* @param marker | |
* @param options object Supported properties: sidebarItem, sidebarItemClassName, sidebarItemWidth, | |
*/ | |
function SidebarItem(marker, opts){ | |
var tag = opts.sidebarItemType || "button"; | |
var row = document.createElement(tag); | |
row.innerHTML = opts.sidebarItem; | |
row.className = opts.sidebarItemClassName || "sidebar_item"; | |
row.style.display = "block"; | |
row.style.width = opts.sidebarItemWidth || "120px"; | |
row.onclick = function(){ | |
google.maps.event.trigger(marker, 'click'); | |
} | |
row.onmouseover = function(){ | |
google.maps.event.trigger(marker, 'mouseover'); | |
} | |
row.onmouseout = function(){ | |
google.maps.event.trigger(marker, 'mouseout'); | |
} | |
this.button = row; | |
} | |
// adds a sidebar item to a | |
SidebarItem.prototype.addIn = function(block){ if(block && block.nodeType == 1)this.div = block; else this.div = document.getElementById(block) || document.getElementById("sidebar") || document.getElementsByTagName("body")[0]; this.div.appendChild(this.button); } // deletes a sidebar item SidebarItem.prototype.remove = function(){ if(!this.div) return false; this.div.removeChild(this.button); return true; } //Feel free to use/develop/molest the functions as you like. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment