当前位置: 首页 > 图文教程 > 网络编程 > Javascript > Google Map Api和GOOGLE Search Api整合实现代码

Javascript
form中限制文本字节数js代码
use jscript with List Proxy Server Information
use jscript List Installed Software
List Installed Software Features
List Information About the Binary Files Used by an Application
List the Codec Files on a Computer
List the UTC Time on a Computer
List Installed Hot Fixes
excel操作之Add Data to a Spreadsheet Cell
Add Formatted Data to a Spreadsheet
Apply an AutoFormat to an Excel Spreadsheet
JavaScript语法着色引擎(demo及打包文件下载)
类之Prototype.js学习
一款JavaScript压缩工具:X2JSCompactor
iis6+javascript Add an Extension File
jscript之Open an Excel Spreadsheet
jscript之Read an Excel Spreadsheet
jscript之List Excel Color Values
去除图像或链接黑眼圈的两种方法总结
Add a Formatted Table to a Word Document

Javascript 中的 Google Map Api和GOOGLE Search Api整合实现代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 579 ::
收藏到网摘: n/a

将GOOGLE MAP API 和 GOOGLE Search API 进行整合,我用面向对象的方式写了一个类,通过传一个经纬度进去,自动通过GOOGLE LOCAL SEARCH获取附近的相关信息。比如餐厅、景点等,反过来标到地图上,并可在任意容器内显示。

将GOOGLE MAP API 和 GOOGLE Search API 进行整合,我用面向对象的方式写了一个类,通过传一个经纬度进去,自动通过GOOGLE LOCAL SEARCH获取附近的相关信息。比如餐厅、景点等,反过来标到地图上,并可在任意容器内显示。
下面是源码:

复制代码 代码如下:

/*
*Author:karry
*Version:1.0
*Time:2008-12-01
*KMapSearch 类
*把GOOGLE MAP 和LocalSearch结合。只需要传入MAP\经纬度值,就可以把该经纬度附近的相关本地搜索内容取出来,在地图上标注出来,并可以在指定容器显示搜索结果
*/
(function() {
var markers= new Array();
var KMapSearch=window.KMapSearch= function(map_, opts_) {
this.opts = {
container:opts_.container || "divSearchResult",
keyWord:opts_.keyWord || "餐厅",
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 />地址:" + 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);
}
})();

使用方法:
复制代码 代码如下:

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:"餐厅"});
mapSearch.clearAll();
mapSearch.execute();

点击这里查看演示示例:经纬度查询整合本地搜索