高德地图-删除多个指定点标记

最新推荐文章于 2022-11-23 18:16:39 发布

采精小蝴蝶

最新推荐文章于 2022-11-23 18:16:39 发布

阅读量1.4k

点赞数

本文链接：https://blog.csdn.net/jrrfgj/article/details/83905124

版权

分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow

也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！

1、问题背景

高德地图上标记多个标记，点击删除按钮，可以删除指定的几个点标记

2、实现源码

<!DOCTYPE html><html> <head>  <meta charset="UTF-8">  <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">     <title>高德地图-删除多个指定点标记</title>     <link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>     <script src="http://webapi.amap.com/maps?v=1.3&key=您申请的key值"></script>     <script type="text/javascript" src="http://cache.amap.com/lbs/static/addToolbar.js"></script> </head> <body>  <div id="container"></div>  <div class="button-group">      <input type="button" class="button" value="删除" id="delMarker"/>  </div>  <script>      var map = new AMap.Map("container", {          resizeEnable: true,          center: [114.20495,30.407079],          zoom: 13      });            AMap.event.addDomListener(document.getElementById('delMarker'), 'click', function() {          markers[1].setMap(null);          markers[3].setMap(null);          markers[5].setMap(null);          markers[7].setMap(null);          markers[9].setMap(null);      }, false);      var markers = [],        positions = [              [114.195423,30.405821],               [114.203662,30.404636],               [114.220828,30.404784],               [114.222202,30.393976],               [114.201431,30.392051],              [114.193448,30.413149],              [114.220657,30.414777],              [114.205379,30.414629],              [114.202976,30.398492],              [114.208812,30.400121]          ];      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'+(i+1)+'.png',              position: positions[i]          });          markers.push(marker);      }  </script> </body></html>