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


Posted in Javascript onJuly 18, 2009

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

 

       将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();

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

Javascript 相关文章推荐
javascript中最常用的继承模式 组合继承
Aug 12 Javascript
子窗口、父窗口和Silverlight之间的相互调用
Aug 16 Javascript
关于jquery的多个选择器的使用示例
Oct 18 Javascript
使用jQuery设置disabled属性与移除disabled属性
Aug 21 Javascript
js 声明数组和向数组中添加对象变量的简单实例
Jul 28 Javascript
jQuery动态增减行的实例代码解析(推荐)
Dec 05 Javascript
微信小程序中使元素占满整个屏幕高度实现方法
Dec 14 Javascript
Bootstrap与Angularjs的模态框实例代码
Aug 03 Javascript
JavaScript函数式编程(Functional Programming)箭头函数(Arrow functions)用法分析
May 22 Javascript
Vue 中可以定义组件模版的几种方式
Aug 06 Javascript
layui use 定义js外部引用函数的方法
Sep 26 Javascript
在vue中高德地图引入和轨迹的绘制的实现
Oct 11 Javascript
比较简单的异步加载JS文件的代码
Jul 18 #Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
Jul 18 #Javascript
DOM 基本方法
Jul 18 #Javascript
javascript 全角转换实现代码
Jul 17 #Javascript
JavaScript 创建对象
Jul 17 #Javascript
prototype 学习笔记整理
Jul 17 #Javascript
表单元素事件 (Form Element Events)
Jul 17 #Javascript
You might like
PHP中的类-什么叫类
2006/11/20 PHP
php操作xml入门之xml标签的属性分析
2015/01/23 PHP
php中使用key,value,current,next和prev函数遍历数组的方法
2015/03/17 PHP
PHP命令空间namespace及use的用法小结
2017/11/27 PHP
PHP性能分析工具xhprof的安装使用与注意事项
2017/12/19 PHP
两个JavaScript jsFiddle JSBin在线调试器
2010/03/14 Javascript
30个精美的jQuery幻灯片效果插件和教程
2011/08/23 Javascript
用jQuery中的ajax分页实现代码
2011/09/20 Javascript
JQuery DataTable删除行后的页面更新利用Ajax解决
2013/05/17 Javascript
使用JSLint提高JS代码质量方法分享
2013/12/16 Javascript
简单的jQuery入门指引
2015/07/28 Javascript
JavaScript+CSS无限极分类效果完整实现方法
2015/12/22 Javascript
推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
2017/04/21 Javascript
JS实现的数组去除重复数据算法小结
2017/11/17 Javascript
JS前端知识点 运算符优先级,URL编码与解码,String,Math,arguments操作整理总结
2019/06/27 Javascript
解决vue更新路由router-view复用组件内容不刷新的问题
2019/11/04 Javascript
Python的Flask框架中web表单的教程
2015/04/20 Python
Django基础之Model操作步骤(介绍)
2017/05/27 Python
python skimage 连通性区域检测方法
2018/06/21 Python
基于Python List的赋值方法
2018/06/23 Python
对Python3 序列解包详解
2019/02/16 Python
python各层级目录下import方法代码实例
2020/01/20 Python
python脚本和网页有何区别
2020/07/02 Python
python字典按照value排序方法
2020/12/28 Python
加拿大领先的时尚和体育零售商:Sporting Life
2019/12/15 全球购物
MIRTA官网:手工包,100%意大利制造
2020/02/11 全球购物
C语言面试题
2013/05/19 面试题
实习单位推荐信范文
2013/11/27 职场文书
高中生学习的自我评价
2013/12/14 职场文书
怎样写好创业计划书的内容
2014/02/06 职场文书
医院信息公开实施方案
2014/05/09 职场文书
教师优秀党员事迹材料
2014/08/14 职场文书
2016春季幼儿园小班开学寄语
2015/12/03 职场文书
使用Spring处理x-www-form-urlencoded方式
2021/11/02 Java/Android
Html5获取用户当前位置的几种方式
2022/01/18 HTML / CSS
Python OpenCV实现图形检测示例详解
2022/04/08 Python