地图开发添加标注物

简介: <p>最近几年在搞地图方面的开发,主要是循环为坐标添加标注并为标注添加弹出信息窗口,起初我的代码如下:</p> <div class="dp-highlighter bg_javascript"> <div class="bar"> <div class="tools"><strong>[javascript]</strong> <a target="_blank" href="h

最近几年在搞地图方面的开发,主要是循环为坐标添加标注并为标注添加弹出信息窗口,起初我的代码如下:

[javascript] view plain copy
  1. var map = new BMap.Map("Mapcontainer");  
  2.               var JsonObj = eval(JsonStr);  
  3.               if (JsonObj != null) {  
  4.                   for (var i = 0; i < JsonObj.length; i++) {  
  5.                          var point = new BMap.Point(JsonObj[i].Visit_GPS_Longitude, JsonObj[i].Visit_GPS_Latitude);    // 创建点坐标  
  6.                          map.centerAndZoom(point, 13);  
  7.                          var marker = new BMap.Marker(point);  
  8.                          var opts = {  
  9.                              width: 250,     // 信息窗口宽度  
  10.                              height: 100,     // 信息窗口高度  
  11.                              title: '<span style="font-size:15px;color:#0A8021">' + JsonObj[i].CustomerName + '</span>'   // 信息窗口标题  
  12.                          }  
  13.                          //marker.setAnimation(BMAP_ANIMATION_BOUNCE);  
  14.                          var content = "进店时间 " + JsonObj[i].VisitBeginTime + "<br/>离店时间 " + JsonObj[i].VisitEndTime;  
  15.                          var info_Window = new BMap.InfoWindow(content, opts);  // 创建信息窗口对象  
  16.                          marker.addEventListener("click"function () {  
  17.                              this.openInfoWindow(info_Window);  
  18.                          });  
  19.                          map.addOverlay(marker);   
  20.                   }   
  21.                   map.addControl(new BMap.NavigationControl());   

这样子确实能添加标注,也弹出信息窗口,但是问题来了!弹出 的信息窗口没有变化,也就是说本来不同的标注上弹出 的信息窗口应该是不一样的,可以不知道怎么回事

弹出的信息窗口一直是最后的那个信息窗口!折腾了好久,最后终于解决了,具体的代码如下:

[javascript] view plain copy
  1. var map = new BMap.Map("Mapcontainer");  
  2.               var JsonObj = eval(JsonStr);  
  3.               if (JsonObj != null) {  
  4.                   for (var i = 0; i < JsonObj.length; i++) {  
  5.                      (function (x) {  
  6.                          var point = new BMap.Point(JsonObj[x].Visit_GPS_Longitude, JsonObj[x].Visit_GPS_Latitude);    // 创建点坐标  
  7.                          map.centerAndZoom(point, 13);  
  8.                          var marker = new BMap.Marker(point);  
  9.                          var opts = {  
  10.                              width: 250,     // 信息窗口宽度  
  11.                              height: 100,     // 信息窗口高度  
  12.                              title: '<span style="font-size:15px;color:#0A8021">' + JsonObj[x].CustomerName + '</span>'   // 信息窗口标题  
  13.                          }  
  14.                          //marker.setAnimation(BMAP_ANIMATION_BOUNCE);  
  15.                          var content = "进店时间 " + JsonObj[x].VisitBeginTime + "<br/>离店时间 " + JsonObj[x].VisitEndTime;  
  16.                          var info_Window = new BMap.InfoWindow(content, opts);  // 创建信息窗口对象  
  17.                          marker.addEventListener("click"function () {  
  18.                              this.openInfoWindow(info_Window);  
  19.                          });  
  20.                          map.addOverlay(marker);  
  21.                      })(i);  
  22.                   }   
  23.                   map.addControl(new BMap.NavigationControl());    

同样是一个循环,但是在循环中使用了一个匿名函数,从而造成一个闭包将 i 的值锁定在里面,这样外部的值已经变化,

但是传到闭包里面的值已经被保留,也就可以顺利拿到应该取到的address[i]的内容了。
这样虽然解决了问题,但是每添加一个点都会创建一个匿名函数,内存泄漏可能会是潜在隐患。
接下去, 我们就可以自由的在地图上标注点并显示对应的信息了!
目录
相关文章
|
数据处理 Python
doccano数据标注平台搭建
基于阿里云服务器ESC示例,搭建doccano数据标注平台
|
3月前
|
人工智能 自然语言处理 搜索推荐
彻底摒弃人工标注,AutoAlign方法基于大模型让知识图谱对齐全自动化
【8月更文挑战第18天】知识图谱作为结构化语义库,在AI领域应用广泛,但构建中实体对齐难题一直存在。近期,AutoAlign提供了一种全自动对齐方案,由张锐等人研发并发布于arXiv。此方法摒弃传统的人工标注依赖,利用大型语言模型实现全自动化对齐。AutoAlign包括谓词与实体对齐两部分,通过构建谓词邻近图及计算实体嵌入,有效提升对齐性能。实验显示其性能超越现有方法,尤其适用于大规模数据集。尽管如此,AutoAlign仍面临计算资源消耗及不同领域适应性等挑战,未来需进一步优化以增强鲁棒性和泛化能力。
57 7
|
5月前
|
文字识别 Linux API
视觉智能开放平台产品使用合集之图像构图美学评分的标准是什么
视觉智能开放平台是指提供一系列基于视觉识别技术的API和服务的平台,这些服务通常包括图像识别、人脸识别、物体检测、文字识别、场景理解等。企业或开发者可以通过调用这些API,快速将视觉智能功能集成到自己的应用或服务中,而无需从零开始研发相关算法和技术。以下是一些常见的视觉智能开放平台产品及其应用场景的概览。
|
6月前
|
定位技术 Android开发
在高德地图添加标注物,及点击标注物感应区域重叠问题
在高德地图添加标注物,及点击标注物感应区域重叠问题
195 0
如何批量制作一物一码标签?
许多行业存在为人员、物品、设备等做一物一码标签的需求,可使用草料标签制作功能。直接选择标签样式,填入数据,即可批量生成标签,还可批量排版,更易落地。还可保存标签样式,后续多次复用样式,批量制作标签。
|
机器学习/深度学习 人工智能 计算机视觉
华南理工TANGO项目原作解读: 文本驱动的三维物体风格化模型
华南理工TANGO项目原作解读: 文本驱动的三维物体风格化模型
169 0
|
机器学习/深度学习 自然语言处理 PyTorch
华人一作统一「视觉-语言」理解与生成:一键生成图像标注,完成视觉问答,Demo可玩
华人一作统一「视觉-语言」理解与生成:一键生成图像标注,完成视觉问答,Demo可玩
222 0
|
PyTorch 算法框架/工具 计算机视觉
|
机器学习/深度学习 传感器 编解码
高精地图落地 | InstaGraM:实时端到端矢量化高精地图新SOTA!
论文提出回归距离转换地图,因为它们在顶点之间提供了强大的空间关系和方向信息,而不是依赖于普通的分割方法。在nuScenes数据集上的综合实验表明,InstaGraM比HDMapNet高13.7mAP,并实现了与VectorMapNet相当的精度,推理速度提高了5倍。
高精地图落地 | InstaGraM:实时端到端矢量化高精地图新SOTA!
|
前端开发 数据库 数据安全/隐私保护
全景图像展示标注网站项目
全景图像展示标注网站项目
126 0
全景图像展示标注网站项目