原文:【百度地图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. 上Mysql com.mysql.jdbc.StatementImpl$CancelTask内存泄漏问题和解决方法

    近来在负责公司短信网关的维护及建设,随着公司业务发展对短信依赖越来越严重了,短信每天发送量也比曾经每天40多w发送量暴增到每天达到200w发送量.由于是採用Java做发送底层,压力递增情况下不可避免的 ...

  2. BZOJ 2038: [2009国家集训队]小Z的袜子(hose) 分块

    分块大法好 2038: [2009国家集训队]小Z的袜子(hose) Time Limit: 20 Sec  Memory Limit: 259 MB Submit: 2938  Solved: 13 ...

  3. PHP关联数组和哈希表(hash table) 未指定

    PHP有数据的一个非常重要的一类,就是关联数组.又称为哈希表(hash table),是一种很好用的数据结构. 在程序中.我们可能会遇到须要消重的问题,举一个最简单的模型: 有一份username列表 ...

  4. 《Linux Device Drivers》第十六章 块设备驱动程序——note

    基本介绍 块设备驱动程序通过主传动固定大小数据的随机访问设备 Linux核心Visual块设备作为基本设备和不同的字符设备类型 Linux块设备驱动程序接口,使块设备最大限度地发挥其效用.一个问题 一 ...

  5. c++ stl algorithm: std::find, std::find_if

    std::find: 查找容器元素, find仅仅能查找容器元素为<基本数据类型> [cpp] view plaincopy #include <iostream> #incl ...

  6. c++日历v1.0版本

    #include<iostream> # include<fstream> #include<time.h> #include<string> #inc ...

  7. implements KeyListener但关键监听器监听少

    今天写的游戏.主要听众,但它并不总是加入了育雏, 我实现了接口,但不听 后来,我发现只是没想到服用口服细致怎么称呼控制panel上面增加了一个addKeyListener(this); 基础不坚固.马 ...

  8. CodeForces 482C Game with Strings

    意甲冠军: n一定长度m串  隐藏的字符串相等的概率  然后,你猜怎么着玩家隐藏的字符串  的询问字符串的一个位置  再不断的知道一些位置后  游戏者就能够确定藏起来的串是什么  问  游戏者的期望步 ...

  9. LINQ之路（1）：LINQ基础

    本文将从什么是LINQ(What).为什么使用LINQ(Why)以及如何使用LINQ(How)三个方面来进行说明. 1.什么是LINQ LINQ(Language Integrated Query)是 ...

  10. Java 启动线程的方式

    面试题:JAVA启动线程的方式有哪些? 1.继承Thread [java] view plaincopy public class java_thread extends Thread{ public ...