javascript高德地图实现点击marker消失marker

<pre>
var markers = [];
var positions = [[120.17718, 30.21772], [120.17718, 30.21872]];
for (var i = 0, marker; i < positions.length; i++) {
marker = new AMap.Marker({
map: map,
icon: "http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png",
position: positions[i],
content: '<div class="marker-route marker-marker-bus-from zhongzimark" zhongziid=1><img class="markerimg" src="http://webapi.amap.com/theme/v1.3/markers/n/mark_b.png" /><div class="markarea"></div></div>' //自定义点标记覆盖物内容
});
markers.push(marker);

markers.push(marker);

}
$.each(markers, function (k, v) {
markers[k].on('click', function () {
//获取html属性方法
var htmlc=markers[k].getContent();
htmlc=$(htmlc);
console.log($(htmlc).attr('zhongziid'))
if ( markers[k]) {
markers[k].setMap(null);
markers[k] = null;
}
/* var str2 = {"personid": <?php echo $personid ?>, "type": 1, "shuzhi": 10, "tag": 3};
str2 = JSON.stringify(str2);
ws.send(str2);*/

});

})
<style>
.zhongzimark {
position: relative;
width: 60px;
height: auto;
overflow: hidden;
}
.markerimg{
width:15%;
}
.markarea{
width:15%;
height:auto;
overflow:hidden;
line-height: 1.3;
text-align: center;
color: #000;
background: #FFF;
}
</style>
</pre>
ps:原理就是 先循环遍历marker 显示并且添加到markers数组 然后循环遍历markers数组添加事件就好了 getContent可以获取到html 然后用jquery attr方法获取属性

javascript高德地图实现点击marker消失marker的更多相关文章

  1. javascript高德地图放到网页中的方法

    javascript高德地图放到网页中的方法 1 先获取到经纬度http://lbs.amap.com/console/show/picker 2 下面代码直接设置下中心点 和标记点就可以了 < ...

  2. android studio高德地图的显示于定位(附带逆地理编码围栏)

    首先注册高德成为开发者(打开高德地图,点击底部的开发者平台),创建应用,按照要求填写相应信息 网站:http://lbs.amap.com/api/android-sdk/guide/create-p ...

  3. Android Studio之高德地图实现定位和3D地图显示

    在应用开发中,地图开发是经常需要使用的“组件”,国内比较出名的是就是百度地图和高德地图. 此博客讲的是高德地图实现定位和3D地图显示,并标注相应位置,话不多说,先看看效果,在上代码. 效果如图: 首先 ...

  4. android高德地图网络路径实现自定义marker并点击弹出自定义窗口

    android中使用地图的地方随处可见,今天记录一下网络路径生成自定义marker,点击标记弹出自定义的窗口(在这里使用的是高德地图) 在这里我们使用Grilde去加载网络图片,因为这个简直太方便了! ...

  5. 【高德地图API】从头德国高中生JS API(三)覆盖物——大喊|折线|多边形|信息表|聚合marker|点蚀图|照片覆盖

    覆盖物,是一张地图的灵魂.有覆盖物的地图.才是完整的地图.在一张地图上,除了底层的底图(瓦片图,矢量图),控件(有功能可操作的工具).最重要最必不可少的就是覆盖物了.覆盖物有多种.包含.标注.折线.多 ...

  6. 【高德地图API】从零开始学高德JS API(三)覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物

    原文:[高德地图API]从零开始学高德JS API(三)覆盖物——标注|折线|多边形|信息窗口|聚合marker|麻点图|图片覆盖物 摘要:覆盖物,是一张地图的灵魂.有覆盖物的地图,才是完整的地图.在 ...

  7. JS高德地图应用 ---- 鼠标点击加入标记 & POI搜索

    代码如下 (填入Key值) : <!DOCTYPE html> <html> <head> <meta charset="utf-8"&g ...

  8. web开发如何使用高德地图API(四)通过AMap.Marker自定义标点

    说两句: 以下内容除了我自己写的部分,其他部分在高德开放平台都有(可点击外链访问). 我所整理的内容以实际项目为基础希望更有针对性的,更精简. 点击直奔主题. 准备工作: 首先,注册开发者账号,成为高 ...

  9. 高德地图(AMap)JavaScript API的使用

    申请JSAPI的开发者key 申请地址:http://lbs.amap.com/dev/key 引入高德地图JavaScript API文件: <script type="text/j ...

随机推荐

  1. SparkSQL读写外部数据源-json文件的读写

    object JsonFileTest { def main(args: Array[String]): Unit = { val spark = SparkSession .builder() .m ...

  2. MySQL 中间件 - DBLE 简单使用

    DBLE 是企业级开源分布式中间件,江湖人送外号 “MyCat Plus”:以其简单稳定,持续维护,良好的社区环境和广大的群众基础得到了社区的大力支持: 环境准备 DBLE项目资料   DBLE官方网 ...

  3. chsh

    修改shell进程

  4. 【数位DP】数字统计

    题目 给定两个正整数a和b,求在[a,b]中的所有整数中,每个数码(digit)各出现了多少次. 数位DP (1)分情况,逐位讨论. (2)模型:计算在[L,R]中有多少个数满足条件. (3)套路:将 ...

  5. 特征的非线性变换(Feature Non-linear Transformation)

    有时候特征x和目标y不呈线性关系,线性模型y=wx+b不能很好地反映事物的规律或者无法对事物进行有效分类,因此此时我们需要使用非线性模型. (x=([x1,x2,...,xn])T,w=([w1,w2 ...

  6. 【洛谷P5596】【XR-4】题

    solution \(y^2-x^2=ax+b\) \(y^2=x^2+ax+b\) 当\(x^2+ax+b\)为完全平方式时\(Ans=inf\) \(x \leq y\) 不妨令 \(y=x+t\ ...

  7. Clion下同时编写多个main函数

    在你的CMakeLists.txt文件下配置,使用add_executable(),前面的一定要不一样 红色部分是描述main的,配置后运行处可以选择:

  8. 【自学Spring Boot】什么是Spring Boot

    为啥要有Spring Boot? 以前大学刚开始学java web的时候,需要搭建起web框架,当时使用的是SSH(struts+spring+hibernate),那就开始搭建吧,初学者哪里知道整套 ...

  9. SSM项目实战 之 EasyUI

    目录 EasyUI 简介 概述 使用EasyUI panel组件 简介 示例 JS形式及属性介绍 panel事件与方法 Window组件 概述 使用 行为 dialog 概述 使用 tabs组件 概述 ...

  10. from bs4 import BeautifulSoup 引入需要安装的文件和步骤

    调用beautifulsoup库时,运行后提示错误: ImportError: No module named bs4 , 意思就是没有找到bs4模块,所以解决方法就是将bs4安装上,具体步骤如下: ...