原文:【百度地图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. hdu 1150 Machine Schedule(最小顶点覆盖)

    pid=1150">Machine Schedule Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/327 ...

  2. PowerDesigner 为sql生成凝视

    在使用pd时发现生成的语句中没有行凝视,这样就得手动来加这些凝视,后来在网上找了一些方法.确实得到了解决,分享一下. 在Database-->edit Current DBMS... 设置dbm ...

  3. Spring.Net控制翻转、依赖注入、面向切面编程

    Spring.Net快速入门:控制翻转.依赖注入.面向切面编程 Spring.Net主要功能: 1.IoC:控制翻转(Inversion of Control)  理解成抽象工厂翻转控制:就是创建对象 ...

  4. expandableListView的divider该溶液显示在黑色

    黑色是divider高度.如何让他成为透明的啊? 布局例如以下:   <ExpandableListView android:layout_width="wrap_content&qu ...

  5. 正确lua简单的扩展，可以加速相关C++数据。

    很早的时候,我有一件事纠结.如果,我在这里C++打开界面脚本.使用C++其中一个目标,和.我的程序有很多不同的lua虚拟机.每个虚拟机与一个关联C++对象,它是多线程,那么如何快速应利用这个好时机lu ...

  6. Sonar——代码质量管理平台

    Sonar——代码质量管理平台 一.基本认识 Sonar (SonarQube)是一个开源平台,用于管理源代码的质量. Sonar 不只是一个质量数据报告工具,更是代码质量管理平台.通过插件机制,So ...

  7. COM Interop

    1.MSDN上的文章:COM Interop教程 2.接口的三种类型:IDispatch.IUnknown和Dual 3.使用TlbImp来更灵活地自动生成RCW 4.托管事件基于委托,而非托管事件( ...

  8. HDU 2227 Find the nondecreasing subsequences(DP)

    Problem Description How many nondecreasing subsequences can you find in the sequence S = {s1, s2, s3 ...

  9. 使用Visual Studio 2010写Data Url生成工具C#版本

    声明:本文系本人按照真实经历原创.未经许可,谢绝转载. 此文百度经验版本号:怎样用Visual Studio 2010打造Data Url生成工具 源代码下载:用Visual Studio 2010编 ...

  10. 初探boost之progress_display库学习笔记

    progress_display 用途 progress_display能够在控制台上显示程序的运行进度,假设程序运行非常耗费时间,那么它能提供一个友好的用户界 面,不至于让用户在等待中失去耐心,甚至 ...