在地图上绘制之创建标注
官方demo示例和讲解——直戳这里
简介
- 所有叠加或覆盖到地图的内容，我们统称为地图覆盖物。
- 覆盖物拥有自己的地理坐标，当拖动或缩放地图时，它们会相应的移动。
- 覆盖物主要分为：
标注（点标注、矢量图形（包括折线、多边形、圆））、信息窗口、图层。
说明：本节重点介绍一下如何向地图添加标注
百度地图提供的覆盖物
| 覆盖物 | 类名 | 说明 |
|---|---|---|
| 抽象基类 | Overlay | 所有的覆盖物均继承此类的方法 |
| 点 | Marker | 表示地图上的点，可自定义标注的图标 |
| 文本 | Label | 表示地图上的文本标注，您可以自定义标注的文本内容 |
| 折线 | Polyline | 表示地图上的折线 |
| 多边形 | Polygon | 表示地图上的多边形。多边形类似于闭合的折线，另外您也可以为其添加填充颜色 |
| 圆 | Circle | 表示地图上的圆 |
| 信息窗口 | InfoWindow | 信息窗口也是一种特殊的覆盖物，它可以展示更为丰富的文字和多媒体信息。注意：同一时刻只能有一个信息窗口在地图上打开 |
| 地面叠加层 | GoundOverlay | 表示叠加在地图上的图片，图片的链接、大小、位置等属性可以自定义 |
| 海量点 | PointCollection | 针对点的数量很大的情况，可以使用海量点进行展示 |
| 自定义覆盖物 | 自定义 | 支持通过继承覆盖物基类Overlay，自定义覆盖物 |
最基础的用法就是：在地图上添加一个点覆盖物。
由上表可知，在这里就需要用到Marker类来创建地图上的标注点了，创建完成之后添加到地图中就可以了。
关于标注点我们要知道的
Marker是一个用来往地图上添加点标记的类。使用它可以将任何你希望用户看到的兴趣点标注在地图上。Marker的构造函数的参数为Point和MarkerOptions（可选）。API提供了默认的图标（标注）样式，我们可以通过Icon类来指定自定义图标。（目前用不上，知道就行）覆盖物类
Marker的使用如下图所示： Marker类的使用详情请戳这里查看
分析：
（1）该构造函数存在两个参数：一个是Point类型的；一个是MarkerOptions类型的。
（2）MarkerOptions类型是可选参数。（目前来说是用不到，如果要使用自定义图标来添加覆盖物的话可以用到该参数） MarkerOptions类的使用详情请戳这里查看
用法：
/*
*百度地图使用BMap作为命名空间，这是人家的规定，知道就行了。
*此外，所有的类都在该命名空间之下。
*如果要使用其他类，应该这么写：比如：BMap.Map()、BMap.Control()、BMap.Overlay()
*/
var mk = new BMap.Marker(point);//创建了一个点类型的标注，即标注点至此，标注点就已经创建完成。下面要做的就是：如何将标注点添加到地图中。
- 可以使用
map.addOverlay方法向地图添加覆盖物，使用map.removeOverlay方法移除覆盖物。 - 注意：此方法不适用于
InfoWindow（即信息窗口覆盖物，下面有提及）。
如下图所示：
图1 —— 核心类Map中的方法
使用方法：
map.addOverlay(mk);//里面的参数为覆盖物实例，所以添加之前肯定要先创建一个覆盖物实例//上面我们使用Marker类的构造函数Marker()创建了一个标注点，同时也创建一个图像标注实例mk。
//所以，在addOverlay()方法中传入之前创建的标注实例mk即可将该标注添加到地图中。图2 —— 覆盖物的抽象基类（点击可查看）
注：（1）所有覆盖物都继承基类的方法；（2）此类不可实例化。
示例
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="initial-scale=1.0,user-scalable=no"><title创建标注</title><style>html,body,#allmap{height: 100%;width: 100%;overflow:hidden;margin:0;font-family: "微软雅黑";}</style><script src="http://api.map.baidu.com/api?v=2.0&ak=3ecea51f560650b1ed8a4b99808f52e8"></script>
</head>
<body><div id="allmap"></div><script>var map = new BMap.Map("allmap");//创建一个地图var point = new BMap.Point(116.404, 39.915);//创建一个地理点坐标map.centerAndZoom(point,12);/*至此，地图初始化完成*/// Marker是一个用来往地图上添加点标记的类。使用它可以将任何你希望用户看到的兴趣点标注在地图上。// Marker的构造函数的参数为Point和MarkerOptions（可选）。var mk = new BMap.Marker(point);//创建标注map.addOverlay(mk);//将标注添加到地图中</script>
</body>
</html>其实也没几行代码，看起来并不复杂：说实话，使用很简单，只要会复制粘贴就行，但是要理解起来还是要花时间研究一下的
