你的位置:首页 > 软件开发 > 网页设计 > 【07】覆盖物(百度地图覆盖物笔记)

【07】覆盖物(百度地图覆盖物笔记)

发布时间:2015-10-28 14:00:19
【07】覆盖物地图覆盖物概述所有叠加或覆盖到地图的内容,我们统称为地图覆盖物。如标注、矢量图形元素(包括:折线和多边形和圆)、信息窗口等。覆盖物拥有自己的地理坐标,当您拖动或缩放地图时,它们会相应的移动。地图API提供了如下几种覆盖物:Overlay:覆盖物的抽象基类,所有的覆盖 ...

【07】覆盖物

地图覆盖物概述

所有叠加或覆盖到地图的内容,我们统称为地图覆盖物。如标注、矢量图形元素(包括:折线和多边形和圆)、信息窗口等。覆盖物拥有自己的地理坐标,当您拖动或缩放地图时,它们会相应的移动。

地图API提供了如下几种覆盖物:

Overlay:覆盖物的抽象基类,所有的覆盖物均继承此类的方法。

Marker:标注表示地图上的点,可自定义标注的图标。

Label:表示地图上的文本标注,您可以自定义标注的文本内容。

Polyline:表示地图上的折线。

Polygon:表示地图上的多边形。多边形类似于闭合的折线,另外您也可以为其添加填充颜色。

Circle: 表示地图上的圆。

InfoWindow:信息窗口也是一种特殊的覆盖物,它可以展示更为丰富的文字和多媒体信息。注意:同一时刻只能有一个信息窗口在地图上打开。

可以使用map.addOverlay方法向地图添加覆盖物,使用map.removeOverlay方法移除覆盖物,注意此方法不适用于InfoWindow。

标注

标注表示地图上的点。API提供了默认图标样式,您也可以通过Icon类来指定自定义图标。Marker的构造函数的参数为Point和 MarkerOptions(可选)。注意:当您使用自定义图标时,标注的地理坐标点将位于标注所用图标的中心位置,您可通过Icon的offset属性 修改标定位置。

下面的示例向地图中心点添加了一个标注,并使用默认的标注样式。

var map = new BMap.Map("container");var point = new BMap.Point(116.404, 39.915);  map.centerAndZoom(point, 15);var marker = new BMap.Marker(point);    // 创建标注  map.addOverlay(marker);           // 将标注添加到地图中

定义标注图标

  1. var map =newBMap.Map("container");
  2. var point =newBMap.Point(116.404,39.915);
  3. map.centerAndZoom(point,15);
  4. var marker =newBMap.Marker(point);// 创建标注
  5. map.addOverlay(marker);// 将标注添加到地图中

Polyline表示地图上的折线覆盖物。它包含一组点,并将这些点连接起来形成折线。

添加折线

折线在地图上绘制为一系列直线段。可以自定义这些线段的颜色、粗细和透明度。颜色可以是十六进制数字形式(比如:#ff0000)或者是颜色关键字(比如:red)。

Polyline的绘制需要浏览器支持矢量绘制功能。在Internet Explorer中,地图使用VML绘制折线;在其他浏览器中使用SVG或者Canvas

以下代码段会在两点之间创建6像素宽的蓝色折线:

  1. var polyline =newBMap.Polyline([
  2. newBMap.Point(116.399,39.910),
  3. newBMap.Point(116.405,39.920)
  4. ],
  5. {strokeColor:"blue", strokeWeight:6, strokeOpacity:0.5}
  6. );
  7. map.addOverlay(polyline);

来自为知笔记(Wiz)


 

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com

原标题:【07】覆盖物(百度地图覆盖物笔记)

关键词:百度

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。