By integrating the Google MAP API with the Google search API, I wrote a class in an object-oriented way, passing through a latitude and longitude to automatically get the relevant information from Google Local Search. such as restaurants, attractions, and so on, in turn marked on the map, and can be displayed in any container.
The following is the source code:
Copy Code code as follows:
/*
*author:karry
*version:1.0
*time:2008-12-01
*kmapsearch class
* Combine Google MAP with Localsearch. Only need to pass in the Map\ latitude value, you can take the latitude and longitude near the relevant local search content out, on the map annotated, and can display the search results in the specified container
*/
(function () {
var markers= new Array ();
var Kmapsearch=window. kmapsearch= function (MAP_, opts_) {
This.opts = {
Container:opts_.container | | "Divsearchresult",
KeyWord:opts_.keyWord | | "Restaurant",
LATLNG:OPTS_.LATLNG | | New GLATLNG (31, 121),
AutoClear:opts_.autoClear | | True
Icon:opts_.icon | | New Gicon (G_default_icon)
};
This.map = MAP_;
This.glocalsearch = new Google.search.LocalSearch ();
This.gLocalSearch.setCenterPoint (THIS.OPTS.LATLNG);
This.gLocalSearch.setResultSetSize (Gsearch.large_resultset);
This.gLocalSearch.setSearchCompleteCallback (this, function () {
if (this.gLocalSearch.results) {
var savedresults = document.getElementById (This.opts.container);
if (this.opts.autoClear) {
savedresults.innerhtml = "";
}
for (var i = 0; i < this.gLocalSearch.results.length; i++) {
Savedresults.appendchild (This.getresult (this.glocalsearch.results[i));
}
}
});
}
KMapSearch.prototype.getResult = function (Result) {
var container = document.createelement ("div");
Container.classname = "List";
var myradom = (new Date ()). GetTime (). toString () +math.floor (Math.random () *10000);
Container.id=myradom;
container.innerhtml = result.title + "<br/> Address:" + result.streetaddress;
This.createmarker (New Glatlng (Result.lat, RESULT.LNG), result.html,myradom);
return container;
}
KMapSearch.prototype.createMarker = function (latlng, content)
{
var marker = new Gmarker (latlng, {icon:this.opts.icon,title:this.opts.title});
Gevent.addlistener (Marker, "click", Function () {
marker.openinfowindowhtml (content);
});
Markers.push (marker);
Map.addoverlay (marker);
}
KMapSearch.prototype.clearAll = function () {
for (var i = 0; i < markers.length; i++) {
This.map.removeOverlay (Markers[i]);
}
markers.length = 0;
}
KMapSearch.prototype.execute = function (latlng) {
if (LATLNG) {
This.gLocalSearch.setCenterPoint (LATLNG);
}
This.gLocalSearch.execute (This.opts.keyWord);
}
})();
How to use:
Copy Code code as follows:
var Myicon = new Gicon (G_default_icon);
Myicon.image = "Canting.png";
Myicon.iconsize = new Gsize (16, 20);
Myicon.iconanchor = new Gpoint (8, 20);
Myicon.shadow = "";
var mapsearch = new Kmapsearch (map, {container: "Cantingcontainer", Latlng:initpt,icon:myicon,keyword: "Restaurant"});
Mapsearch.clearall ();
Mapsearch.execute ();
Click here to see the demo example: a latitude and longitude query consolidated local Search
