原文:【百度地图API】如何判断点击的是地图还是覆盖物？

摘要：很多API爱好者问我，为什么我点击的是marker，而map也会响应该事件呢？怎样才能判断，我点击的是标注，还是地图呢？下面一起来看看。

------------------------------------------------------------

先看看地图有哪些事件，查看官网类参考，翻到事件：

大家看到这里的参数了麽？

其实，在点击物体时，通过这些参数就能够判断所点击的物体是什么了。

用marker举例：

先创建一个marker

//覆盖物Marker

    var pmk = new BMap.Point(116.249472,39.946583);

    var mk = new BMap.Marker(pmk);

    map.addOverlay(mk);

然后对地图添加点击事件，如果判断出来是覆盖物，就弹出相应的对话框。

    map.addEventListener("click",function(e){

        if(e.overlay){

            alert('你点击的是覆盖物：'+e.overlay.toString());

        }else{

            alert('你点击的是地图');

        }

    });

添加一堆覆盖物，然后给每个覆盖物写点击事件。

比如我点击了多边形，就会弹出这个。

全部源代码：

<!DOCTYPE html>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>点击事件</title>

<script type="text/javascript" src="http://api.map.baidu.com/api?key=v=1.3"></script>

</head>

<body>

  <!--百度地图容器-->

  <div style="width:697px;height:550px;border:#ccc solid 1px;" id="dituContent"></div>

</body>

<script type="text/javascript">

    var map = new BMap.Map("dituContent");

    var point = new BMap.Point(116.331398,39.897445);

    map.centerAndZoom(point,12);

    map.enableScrollWheelZoom();

    map.addEventListener("click",function(e){

        if(e.overlay){

            alert('你点击的是覆盖物：'+e.overlay.toString());

        }else{

            alert('你点击的是地图');

        }

    });

    //覆盖物Marker

    var pmk = new BMap.Point(116.249472,39.946583);

    var mk = new BMap.Marker(pmk);

    map.addOverlay(mk);

    //覆盖物Label

    var plb = new BMap.Point(116.408149,39.958087);

    var lb = new BMap.Label('我是覆盖物Label',{point:plb});

    map.addOverlay(lb);

    //覆盖物Polyline

    var pl = new BMap.Polyline([new BMap.Point(116.250047,39.919583),new BMap.Point(116.441494,39.919583)],{strokeWeight:10})

    map.addOverlay(pl);

    //覆盖物Polygon

    var pg = new BMap.Polygon([new BMap.Point(116.248323,39.893016),new BMap.Point(116.440344,39.893016),new BMap.Point(116.440344,39.811036),new BMap.Point(116.248323,39.811036)]);

    map.addOverlay(pg);

</script>

</html>

【百度地图API】如何判断点击的是地图还是覆盖物？的更多相关文章

  1. 【百度地图API】如何制作一张魔兽地图！！——CS地图也可以，哈哈哈

    原文:[百度地图API]如何制作一张魔兽地图!!--CS地图也可以,哈哈哈 摘要: 你玩魔兽不?你知道如何做一张魔兽地图不?! 快来看此文吧! ---------------------------- ...

  2. 用百度地图API打造方便自己使用的手机地图

    有钱人咱就不说了,因为偶是个穷银--因为穷,所以去年买的Huawei C8650+到现在还在上岗,对于没有钱买好的配置的手机的童鞋来说,类似于百度,谷歌,高德等商家的地图在自己的机器上跑起来确实是有点 ...

  3. 百度地图API示例之根据城市名设置地图中心点

    代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" con ...

  4. 地图API使用文档-以腾讯地图为例

    目录 腾讯地图API 2 1.API概览... 2 1.1 WebService API(官网注明是beta版本,可能不稳定,慎用):... 2 1.2 URL API:... 2 1.3 静态图AP ...

  5. [WEB地图] 2017高德地图API WEB开发（key申请，地图搭建）简约教程

      前端时间因为公司需要研究 了一下百度的教程 然后写个简约的笔记记录一下自己学习的收获,只为了满足自己暂时的写作热情   高德地图WEB开发(key申请.api)简约教程 1.首先我们需要去“高德地 ...

  6. 百度地图Api进阶教程-点击生成和拖动标注4.html

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  7. 根据百度地图API得到坐标和地址并在地图上显示

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout ...

  8. 【高德地图API】VS2012或者VS2013添加高德地图v2.1.1版本SDK失败

    可能由于v2.1.1版本SDK可能是在Win8.1环境下编译[这里有许多的原因,系统升级,安装VS2013等等] 有童鞋在操作正常的情况下添加SDK失败,提示版本不兼容. 如下图: 编辑项目  *.c ...

  9. 百度地图API和高德地图API资料集锦

    [高德地图API]从零开始学高德JS API(五)路线规划——驾车|公交|步行   [高德地图API]从零开始学高德JS API(四)搜索服务——POI搜索|自动完成|输入提示|行政区域|交叉路口|自 ...

随机推荐

  1. Android设计模式（十）－－生成器模式

    回头看自己写的东西,大概Android当自己控制的定义,编写代码适用性比较高.但是,看看没有什么技术含量,因此,当在学习设计模式,想想有些东西是否可以改善,例如: 自己定义Dialog是Android ...

  2. php 无错误提示 的解决方法

    问:我在win7安装了PHP,浏览器是IE9.我代码写错了,浏览器一点错误提示都没有,一片空白.如果写对了,就能正常运行显示出来.请问这是怎么回事,应该怎么弄?你们两个的方法都试过,但都没有提示(注: ...

  3. think in coding

    ,想想除了技术还有什么? 你假设形而下的去纠结技术.仅仅会变成技术的傀儡.他们仅仅是一种表达的方式? 希望你能够形而上的去看待技术,技术千变万化,但都是为了解决这个问题的方式. 请问问自己,自己问题是 ...

  4. 初探swift语言的学习笔记五(线程)

    作者:fengsh998 原文地址:http://blog.csdn.net/fengsh998/article/details/30354127 转载请注明出处 假设认为文章对你有所帮助,请通过留言 ...

  5. D其他项目打电话AL工程EF Model

     Based on your description and the error code, you will just need to ensure that your DataContext ...

  6. HDU2149-Public Sale

    Public Sale Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Tota ...

  7. Android获取本机IP地址

    一.概述 习惯了Linux下的网络编程,在还没用智能机之前就一直想知道怎么得到手机的IP地址(玩智能机之前我是不搞手机应用的).好了,得知Android是基于Linux内核的,那么不就可以利用之前学的 ...

  8. Ignite China微软技术

    首届Ignite China微软技术大会见闻   10.26-10.28,有幸参加微软在中国北京举办的首届Ignite China技术大会.世界那么大,技术那么多,我想去看看. 为期三天的技术大会在小 ...

  9. SQL Server 索引列的顺序——真的没关系吗

    原文:SQL Server 索引列的顺序--真的没关系吗 翻译自:http://www.mssqltips.com/sqlservertip/2718/sql-server-index-column- ...

  10. 测试数据库sql声明效率

    书写sql当被发现的声明.对于所期望的结果通常是更好地执行. 当面对这些实现的时候如何选择它的最好的,相对来说?这导致了这个博客的话题,如何测试sql效率 以下介绍几种sql语句測试效率的方法,大多数 ...