js的闭包解决百度地图的信息窗口问题
来源:互联网 发布:nginx整合php 编辑:程序博客网 时间:2024/06/01 09:49
在使用百度地图的时候我们常常会碰到这样的需求:同时给多个Point进行标注并添加InfoWindow,或许我们会很快想到将多个Point类添加到一个List中,然后利用循环遍历的方式对所有的Point类添加InfoWindow。但事情似乎并不是我们想象那么简单,因为但我们一切工程就绪后会突然发现一个令人抓狂的问题,InfoWindow的内容全是一样的!!!而且都是最后一个Point的内容。这让我瞬间没辙了。但好在有xw老师的帮助,为我提供了js闭包的解决思路,经过专研,it‘s OK!源码奉上:
<script> var map=new BMap.Map("map-chart"); var point=new BMap.Point(104.06,30.67); map.centerAndZoom(point,11); map.enableScrollWheelZoom(); map.addControl(new BMap.NavigationControl()); var url="./EntityServlet"; var addMarker = function(equipment){ //传递的是entities var realtime_point=equipment['realtime_point']; var realtime_location=equipment['realtime_point']['location']; //alert(realtime_location ); var strLng=realtime_location[0]; var strLat=realtime_location[1]; var point = new BMap.Point(strLng,strLat); var marker = new BMap.Marker(point); map.addOverlay(marker); var label = new window.BMap.Label(equipment['entity_name'], { offset: new window.BMap.Size(20, -10) }); marker.setLabel(label); var opts1= { width: 50, // 信息窗口宽度 height: 200, // 信息窗口高度 title: equipment['entity_name'] // 信息窗口标题 } var name=equipment["entity_name"]; //var state=equipment["equipment_state"]; var speed=realtime_point["speed"]; var direction_num=realtime_point["direction"]; var moment=equipment["modify_time"]; var direction; if(direction_num=0){direction="正北"} else if(0<direction_num<90){direction="东北"} else if(direction_num=90){direction="正东"} else if(90<direction_num<180){direction="东南"} else if(direction_num=180){direction="正南"} else if(180<direction_num<270){direction="西南"} else if(direction_num=270){direction="正西"} else{direction="西北"} //alert(name); var html ="<p><hr>"+ // "状态:"+state+"<br>"+ "速度:"+speed+"<br>"+ "方向:"+direction+"<br>"+ "时间:"+moment+"<br></p>"+ "<a href='javascript:getTotalDistance(\""+name+"\")'>查询里程</a>" //"<a href='javascript:getTotalDistance(\""+name+"\")'>查询里程</a>" //"<input type='button' value='轨迹回放' id='getTraceBtn' onclick='GetDistanceServlet?entity='"+name+">" //"<input type='button' value='轨迹回放' id='getTraceBtn' onclick='getTotalDistance(\'"+name+"\')'>" //alert(html); var infoWindow = new BMap.InfoWindow(html,opts1); marker.addEventListener("click", function () { this.openInfoWindow(infoWindow);}); }; $(document).ready(function () { $.post(url, function (data) { //alert(data); var json = eval("(" + data + ")"); //alert("建立json对象成功!"); var equipmentList = json.entities; //equipmentList是一张对应的列表 /**************在地图上标注相应的点*********************/ for (var i = 0; i < equipmentList.length; i++) { addMarker(equipmentList[i]); } //alert("解析json对象成功!"); alert(result); }); }); function getTotalDistance(name) { //alert(name); $.get("GetDistanceServlet?entity_name="+name,function (data) { //alert(data); var json=eval("("+data+")"); alert(json['entity_name']+"的总里程为"+json['distance']/1000+"Km"); }); }//获取轨迹</script>我仅说说我的理解这里将函数addMarker作为一个变量,然后像普通函数一样使用。至于为什么能使之前的问题得到解决,我还得看看,也希望各位能给我些帮助。(效果图如下)
0 0
- js的闭包解决百度地图的信息窗口问题
- 百度地图 循环加载marker并添加多个信息窗口,解决只显示最后一个窗口信息的问题
- 百度地图 遍历marker并增加窗口 只显示最后一个窗口信息的问题
- js 百度地图自定义弹出信息窗口
- 百度地图api开发一:信息窗口不能多次显示的问题
- 百度地图InfoWindow循环显示不同的信息窗口
- 自定义百度地图全局搜索结果的信息窗口
- 解决百度地图黑屏显示的问题
- 百度地图API详解之事件机制,function“闭包”解决for循环和监听器冲突的问题:
- 百度地图开发--解决地图无法显示的问题
- JS中引用百度地图将百度地图的logo和信息去掉
- 百度地图的问题
- 关于百度地图的导入包的问题!
- 关于android 百度地图离线包的调用问题
- 关于android 百度地图离线包的调用问题
- 怎么解决android开发的百度地图的签名问题
- 解决更新百度地图定位sdk遇到的问题。
- 解决使用百度地图默认定位是北京的问题
- opencv第四课----smooth函数使用(提出几个课后作业,希望完成)
- android中gravity和layout_gravity的区别
- 指针与引用
- SQL Server 2008 parseJSON函数将JSON解析成Table
- ActionBar
- js的闭包解决百度地图的信息窗口问题
- 跨域技术JSONP
- 狗狗们来袭!分享一个独立小游戏,狗狗后院!
- 指针
- 使用 ViewStub 延迟加载布局
- leetcode 120 Triangle
- mysql安装
- SQL Server 2008 clearhtml函数清除字段中的HTML标记
- Linux学习——基本命令(1)