百度地图地图API(常用)
2024-05-10 23:27:04
百度地图开发常用网站
1、百度地图开放平台
http://lbsyun.baidu.com/
2、百度地图 Javascript API
JavaScript API v3.0 http://lbsyun.baidu.com/index.php?title=jspopular3.0
JavaScript API v2.0 http://lbsyun.baidu.com/index.php?title=jspopular
JavaScript API Lite http://lbsyun.baidu.com/index.php?title=jspopularLiteV1
3、JavaScript API v2.0类参考
http://lbsyun.baidu.com/cms/jsapi/reference/jsapi_reference.html
4、百度地图示例DEMO（JavaScript API v2.0）
http://lbsyun.baidu.com/jsdemo.htm#a1_2
5、百度地图 ak 申请：（JavaScript API v2.0）
http://lbsyun.baidu.com/index.php?title=jspopular/guide/getkey
6、开源库（JavaScript API v2.0）：鼠标绘制工具条、热力图、聚合marker、测距工具、自定义覆盖物、自定义信息窗口、路书等功能
http://lbsyun.baidu.com/index.php?title=jspopular/openlibrary
7、百度地图坐标拾取系统
http://api.map.baidu.com/lbsapi/getpoint/index.html
说明
项目中使用 JavaScript API v2.0 版本，当然也可以使用最新版 V3.0。
JavaScript API Lite是移动端浏览器上构建地图应用
百度地图地图及图层事件处理
1、百度地图 ak 申请：（JavaScript API v2.0）
http://lbsyun.baidu.com/index.php?title=jspopular/guide/getkey
2、地图及图层事件、使用方式：
核心类
Map：此类是地图API的核心类，用来实例化一个地图。
地图事件使用方式：例子
//右键单击地图时触发此事件
map.addEventListener("rightclick", function (e) {
alert("鼠标右键操作");
});
//停止拖拽地图时触发
map.addEventListener("dragend", function (e) {
//要做的事情
});
//地图更改缩放级别结束时触发触发此事件
map.addEventListener("zoomend", function (e) {
//要做的事情
});
地图API：工作中用到的用红色标出
| 构造函数 | 描述 |
| Map(container: String | HTMLElement, opts: MapOptions) | 在指定的容器内创建地图实例，之后需要调用Map.centerAndZoom()方法对地图进行初始化。未进行初始化的地图将不能进行任何操作 |
| 方法 | 返回值 | 描述 |
| enableDragging() | none | 启用地图拖拽，默认启用 |
| disableDragging() | none | 禁用地图拖拽 |
| enableScrollWheelZoom() | none | 启用滚轮放大缩小，默认禁用 |
| disableScrollWheelZoom() | none | 禁用滚轮放大缩小 |
| enableDoubleClickZoom() | none | 启用双击放大，默认启用 |
| disableDoubleClickZoom() | none | 禁用双击放大 |
| enableKeyboard() | none | 启用键盘操作，默认禁用。键盘的上、下、左、右键可连续移动地图。同时按下其中两个键可使地图进行对角移动。PgUp、PgDn、Home和End键会使地图平移其1/2的大小。+、-键会使地图放大或缩小一级 |
| disableKeyboard() | none | 禁用键盘操作 |
| enableInertialDragging() | none | 启用地图惯性拖拽，默认禁用 |
| disableInertialDragging() | none | 禁用地图惯性拖拽 |
| enableContinuousZoom() | none | 启用连续缩放效果，默认禁用 |
| disableContinuousZoom() | none | 禁用连续缩放效果 |
| enablePinchToZoom() | none | 启用双指操作缩放，默认启用 |
| disablePinchToZoom() | none | 禁用双指操作缩放 |
| enableAutoResize() | none | 启用自动适应容器尺寸变化，默认启用 |
| disableAutoResize() | none | 禁用自动适应容器尺寸变化 |
| setDefaultCursor(cursor: String) | none | 设置地图默认的鼠标指针样式。参数cursor应符合CSS的cursor属性规范 |
| getDefaultCursor() | String | 返回地图默认的鼠标指针样式 |
| setDraggingCursor(cursor: String) | none | 设置拖拽地图时的鼠标指针样式。参数cursor应符合CSS的cursor属性规范 |
| getDraggingCursor() | String | 返回拖拽地图时的鼠标指针样式 |
| setMinZoom(zoom: Number) | none | 设置地图允许的最小级别。取值不得小于地图类型所允许的最小级别 |
| setMaxZoom(zoom: Number) | none | 设置地图允许的最大级别。取值不得大于地图类型所允许的最大级别 |
| setMapStyle() | none | 设置地图样式，样式包括地图底图颜色和地图要素是否展示两部分 |
| setPanorama(pano: Panorama) | none | 将全景实例与Map类进行绑定 |
| getBounds() | Bounds | 返回地图可视区域，以地理坐标表示 |
| getCenter() | Point | 返回地图当前中心点 |
| getDistance(start: Point, end: Point) | Number | 返回两点之间的距离，单位是米 |
| getMapType() | MapType | 返回地图类型 |
| getSize() | Size | 返回地图视图的大小，以像素表示 |
| getViewport(view: Array<Point>, viewportOptions: ViewportOptions) | Viewport | 根据提供的地理区域或坐标获得最佳的地图视野，返回的对象中包含center和zoom属性，分别表示地图的中心点和级别。此方法仅返回视野信息，不会将新的中心点和级别做用到当前地图上 |
| getZoom() | Number | 返回地图当前缩放级别 |
| getPanorama() | Panorama | 获取与Map类绑定的全景实例 |
| centerAndZoom(center: Point, zoom: Number) | none | 设初始化地图。 如果center类型为Point时，zoom必须赋值，范围3-19级，若调用高清底图（针对移动端开发）时，zoom可赋值范围为3-18级。如果center类型为字符串时，比如“北京”，zoom可以忽略，地图将自动根据center适配最佳zoom级别 |
| panTo(center: Point, opts: PanOptions) | none | 将地图的中心点更改为给定的点。如果该点在当前的地图视图中已经可见，则会以平滑动画的方式移动到中心点位置。可以通过配置强制移动过程不使用动画效果 |
| panBy(x: Number, y: Number, opts: PanOptions) | none | 将地图在水平位置上移动x像素，垂直位置上移动y像素。如果指定的像素大于可视区域范围或者在配置中指定没有动画效果，则不执行滑动效果 |
| reset() | none | 重新设置地图，恢复地图初始化时的中心点和级别 |
| setCenter(center: Point | String) | none | 设置地图中心点。center除了可以为坐标点以外，还支持城市名 |
| setCurrentCity(city: String) | none | 设置地图城市，注意当地图初始化时的类型设置为BMAP_NORMAL_MAP时，需要在调用centerAndZoom之前调用此方法设置地图所在城市。例如： var map = new BMap.Map(“container”, {mapType: BMAP_NORMAL_MAP}); map.setCurrentCity(“北京市”); map.centerAndZoom(new BMap.Point(116.404, 39.915), 18); 注意：初始化的坐标应与您设置的城市对应，否则地图将无法正常显示。 |
| setMapType(mapType: MapTypes) | none | 设置地图类型 |
| setViewport(view: Array<Point> | Viewport, viewportOptions: ViewportOptions) | none | 根据提供的地理区域或坐标设置地图视野，调整后的视野会保证包含提供的地理区域或坐标 |
| setZoom(zoom: Number) | none | 将视图切换到指定的缩放等级，中心点坐标不变。注意：当有信息窗口在地图上打开时，地图缩放将保证信息窗口所在的坐标位置不动 |
| highResolutionEnabled() | Boolean | 是否使用高分辨率底图。仅当mapOptions.enableHighResolution属性为true且设备支持高分辨率时返回true |
| zoomIn() | none | 放大一级视图 |
| zoomOut() | none | 缩小一级视图 |
| addHotspot(hotspot: Hotspot) | none | 为地图添加热区 |
| removeHotspot(hotspot: Hotspot) | none | 移除某个地图热区 |
| clearHotspots() | none | 清空地图所有热区 |
| addControl(control: Control) | none | 将控件添加到地图，一个控件实例只能向地图中添加一次 |
| removeControl(control: Control) | none | 从地图中移除控件。如果控件从未被添加到地图中，则该移除不起任何作用 |
| getContainer() | HTMLElement | 返回地图的容器元素。当创建用户自定义控件时，需要自行实现Control.initialize()方法，并将控件的容器元素添加到地图上，通过此方法可获得地图容器 |
| addContextMenu(menu: ContextMenu) | none | 添加右键菜单 |
| removeContextMenu(menu: ContextMenu) | none | 移除右键菜单 |
| addOverlay(overlay: Overlay) | none | 将覆盖物添加到地图中，一个覆盖物实例只能向地图中添加一次 |
| removeOverlay(overlay: Overlay) | none | 从地图中移除覆盖物。如果覆盖物从未被添加到地图中，则该移除不起任何作用 |
| clearOverlays() | none | 清除地图上所有覆盖物 |
| openInfoWindow(infoWnd: InfoWindow, point: Point) | none | 在地图上打开信息窗口 |
| closeInfoWindow() | none | 关闭在地图上打开的信息窗口。在标注上打开的信息窗口也可通过此方法进行关闭 |
| pointToOverlayPixel(point: Point) | Pixel | 根据地理坐标获取对应的覆盖物容器的坐标，此方法用于自定义覆盖物 |
| overlayPixelToPoint(pixel: Pixel) | Point | 根据覆盖物容器的坐标获取对应的地理坐标 |
| getInfoWindow() | InfoWindow | Null | 返回地图上处于打开状态的信息窗的实例。当地图没有打开的信息窗口时，此方法返回null |
| getOverlays() | Array<Overlay> | 返回地图上的所有覆盖物 |
| getPanes() | MapPanes | 返回地图覆盖物容器列表 |
| addTileLayer(tileLayer: TileLayer) | none | 添加一个自定义地图图层 |
| removeTileLayer(tileLayer: TileLayer) | none | 移除一个自定义地图图层 |
| getTileLayer(mapType: String) | TileLayer | 通过地图类型得到一个地图图层对象 |
| pixelToPoint(pixel: Pixel) | Point | 像素坐标转换为经纬度坐标 |
| pointToPixel(point: Point) | Pixel | 经纬度坐标转换为像素坐标 |
地图事件API：工作中用到的用红色标出,前面 3 个时最常用的
| 事件 | 参数 | 描述 |
|
click |
{type, target, point, pixel, overlay} |
左键单击地图时触发此事件。 当双击时，产生的事件序列为： click click dblclick |
|
dblclick |
{type, target, pixel, point} |
鼠标双击地图时会触发此事件 |
|
rightclick |
{type, target, point, pixel, overlay} |
右键单击地图时触发此事件。 当双击时，产生的事件序列为： rightclick rightclick rightdblclick |
| rightdblclick | {type, target, point, pixel, overlay} | 右键双击地图时触发此事件 |
| maptypechange | {type, target} | 地图类型发生变化时触发此事件 |
| mousemove | {type, target, point, pixel, overlay} | 鼠标在地图区域移动过程中触发此事件 |
| mouseover | {type, target} | 鼠标移入地图区域时触发此事件 |
| mouseout | {type, target} | 鼠标移出地图区域时触发此事件 |
| movestart | {type, target} | 地图移动开始时触发此事件 |
| moving | {type, target} | 地图移动过程中触发此事件 |
| moveend | {type, target} | 地图移动结束时触发此事件 |
| zoomstart | {type, target} | 地图更改缩放级别开始时触发触发此事件 |
| zoomend | {type, target} | 地图更改缩放级别结束时触发触发此事件 |
| addoverlay | {type, target} | 当使用Map.addOverlay()方法向地图中添加单个覆盖物时会触发此事件 |
| addcontrol | {type, target} | 当使用Map.addControl()方法向地图中添加单个控件时会触发此事件 |
| removecontrol | {type, target} | 当使用Map.removeControl()方法移除单个控件时会触发此事件 |
| removeoverlay | {type, target} | 当使用Map.removeOverlay()方法移除单个覆盖物时会触发此事件 |
| clearoverlays | {type, target} | 当使用Map.clearOverlays()方法一次性移除全部覆盖物时会触发此事件 |
| dragstart | {type, target, pixel, point} | 开始拖拽地图时触发 |
| dragging | {type, target, pixel, point} | 拖拽地图过程中触发 |
| dragend | {type, target, pixel, point} | 停止拖拽地图时触发 |
| addtilelayer | {type, target} | 添加一个自定义地图图层时触发此事件 |
| removetilelayer | {type, target} | 移除一个自定义地图图层时触发此事件 |
| load | {type, target, pixel, point, zoom} | 调用Map.centerAndZoom()方法时会触发此事件。这表示位置、缩放层级已经确定，但可能还在载入地图图块 |
| resize | {type, target, size} | 地图可视区域大小发生变化时会触发此事件 |
| hotspotclick | {type, target, spots} | 点击热区时触发此事件 |
| hotspotover | {type, target, spots} | 鼠标移至热区时触发此事件 |
| hotspotout | {type, target, spots} | 鼠标移出热区时触发此事件 |
| tilesloaded | {type, target} | 当地图所有图块完成加载时触发此事件 |
| touchstart | {type, target, point,pixel} | 触摸开始时触发此事件，仅适用移动设备 |
| touchmove | {type, target, point,pixel} | 触摸移动时触发此事件，仅适用移动设备 |
| touchend | {type, target, point,pixel} | 触摸结束时触发此事件，仅适用移动设备 |
| longpress | {type, target, point,pixel} | 长按事件，仅适用移动设备 |
覆盖物类（图层）
Overlay: 覆盖物的抽象基类，所有覆盖物均继承基类的方法。此类不可实例化。
| 方法 | 返回值 | 描述 |
| initialize(map: Map) | HTMLElement | 抽象方法，用于初始化覆盖物，当调用map.addOverlay时，API将调用此方法。自定义覆盖物时需要实现此方法。自定义覆盖物时需要将覆盖物对应的HTML元素返回 |
| isVisible() | Boolean | 判断覆盖物是否可见 |
| draw() | none | 抽象方法，当地图状态发生变化时，由系统调用对覆盖物进行绘制。自定义覆盖物需要实现此方法 |
| show() | none | 显示覆盖物。对于自定义覆盖物，此方法会自动将initialize方法返回的HTML元素样式的display属性设置为空 |
| hide() | none | 隐藏覆盖物。对于自定义覆盖物，此方法会自动将initialize方法返回的HTML元素样式的display属性设置为none |
Marker：此类表示地图上一个图像标注。（常用）
图层事件使用方式：例子
marker.addEventListener("rightclick", function (e) {
alert("鼠标右键操作");
});
//鼠标经过图层时的操作
marker.addEventListener("mouseover", function (e) {
//要做的事情
});
//鼠标离开图层后的操作
marker.addEventListener("mouseout", function (e) {
//要做的事情
});
API:
| 构造函数 | 描述 |
| Marker(point: Point, opts: MarkerOptions) | 创建一个图像标注实例。point参数指定了图像标注所在的地理位置 |
| 方法 | 返回值 | 描述 |
| openInfoWindow(infoWnd: InfoWindow) | none | 打开信息窗 |
| closeInfoWindow() | none | 关闭信息窗 |
| setIcon(icon: Icon) | none | 设置标注所用的图标对象 |
| getIcon() | Icon | 返回标注所用的图标对象 |
| setPosition(position: Point) | none | 设置标注的地理坐标 |
| getPosition() | Point | 返回标注的地理坐标 |
| setOffset(offset: Size) | none | 设置标注的偏移值 |
| getOffset() | Size | 返回标注的偏移值 |
| getLabel() | Label | 返回标注的文本标注 |
| setLabel(label: Label) | none | 为标注添加文本标注 |
| setTitle(title: String) | none | 设置标注的标题，当鼠标移至标注上时显示此标题 |
| getTitle() | String | 返回标注的标题 |
| setTop(isTop: Boolean) | none | 将标注置于其他标注之上。默认情况下，纬度较低的标注会覆盖在纬度较高的标注之上，从而形成一种立体效果。通过此方法可使某个标注覆盖在其他所有标注之上。注意：如果在多个标注对象上调用此方法，则这些标注依旧按照纬度产生默认的覆盖效果 |
| enableDragging() | none | 开启标注拖拽功能 |
| disableDragging() | none | 关闭标注拖拽功能 |
| enableMassClear() | none | 允许覆盖物在map.clearOverlays方法中被清除 |
| disableMassClear() | none | 禁止覆盖物在map.clearOverlays方法中被清除 |
| setZIndex(zIndex: Number) | none | 设置覆盖物的zIndex |
| getMap() | Map | 返回覆盖物所在的map对象 |
| addContextMenu(menu: ContextMenu) | none | 添加右键菜单 |
| removeContextMenu(menu: ContextMenu) | none | 移除右键菜单 |
| setAnimation(animation: Animation | Null) | none | 设置标注动画效果。如果参数为null，则取消动画效果。该方法需要在addOverlay方法后设置 |
| setRotation(rotation: Number) | none | 设置点的旋转角度 |
| getRotation() | Number | 获取点的旋转角度 |
| setShadow(shadow: Icon) | none | 设置标注阴影图标 |
| getShadow() | Icon | 获取标注阴影图标 |
| addEventListener(event: String, handler: Function) | none | 添加事件监听函数 |
| removeEventListener(event: String, handler: Function) | none | 移除事件监听函数 |
Label：此类表示地图上的文本标注。（常用）
API:
| 构造函数 | 描述 |
| Label(content: String, opts: LabelOptions) | 创建一个文本标注实例。point参数指定了文本标注所在的地理位置 |
| 方法 | 返回值 | 描述 |
| setStyle(styles: Object) | none | 设置文本标注样式，该样式将作用于文本标注的容器元素上。其中styles为JavaScript对象常量，比如： setStyle({ color : "red", fontSize : "12px" }) 注意：如果css的属性名中包含连字符，需要将连字符去掉并将其后的字母进行大写处理，例如：背景色属性要写成：backgroundColor |
| setContent(content: String) | none | 设置文本标注的内容。支持HTML |
| setPosition(position: Point) | none | 设置文本标注坐标。仅当通过Map.addOverlay()方法添加的文本标注有效 |
| getPosition() | Point | 获取Label的地理坐标 |
| setOffset(offset: Size) | none | 设置文本标注的偏移值 |
| getOffset() | Size | 返回文本标注的偏移值 |
| setTitle(title: String) | none | 设置文本标注的标题，当鼠标移至标注上时显示此标题 |
| getTitle() | String | 返回文本标注的标题 |
| enableMassClear() | none | 允许覆盖物在map.clearOverlays方法中被清除 |
| disableMassClear() | none | 禁止覆盖物在map.clearOverlays方法中被清除 |
| setZIndex(zIndex: Number) | none | 设置覆盖物的zIndex |
| setPosition(position: Point) | none | 设置地理坐标 |
| getMap() | Map | 返回覆盖物所在的map对象 |
| addEventListener(event: String, handler: Function) | none | 添加事件监听函数 |
| removeEventListener(event: String, handler: Function) | none | 移除事件监听 |
| 事件 | 参数 | 描述 |
| click | event{type, target} | 点击文本标注后会触发此事件 |
| dblclick | event{type, target} | 双击文本标注后会触发此事件 |
| mousedown | event{type, target} | 鼠标在文本标注上按下触发此事件 |
| mouseup | event{type, target} | 鼠标在文本标注释放触发此事件 |
| mouseout | event{type, target} | 鼠标离开文本标注时触发此事件 |
| mouseover | event{type, target} | 当鼠标进入文本标注区域时会触发此事件 |
| remove | event{type, target} | 移除文本标注时触发 |
| rightclick | event{type, target} | 右键点击标注时触发此事件 |
Icon:此类表示标注覆盖物所使用的图标。（常用）
| 构造函数 | 描述 |
| Icon(url: String, size: Size, opts: IconOptions) | 以给定的图像地址和大小创建图标对象实例 |
| 属性 | 类型 | 描述 |
| anchor | Size | 图标的定位点相对于图标左上角的偏移值 |
| size | Size | 图标可视区域的大小 |
| imageOffset | Size | 图标所用的图片相对于可视区域的偏移值，此功能的作用等同于CSS中的background-position属性 |
| imageSize | Size | 图标所用的图片的大小，此功能的作用等同于CSS中的background-size属性。可用于实现高清屏的高清效果 |
| imageUrl | String | 图标所用图像资源的位置 |
| infoWindowAnchor | Size | 信息窗口开启位置相对于图标左上角的偏移值 |
| printImageUrl | String | 设置icon打印图片的url，该打印图片只针对IE6有效，解决IE6使用PNG滤镜导致的错位问题。如果您的icon没有使用PNG格式图片或者没有使用CSS Sprites技术，则可忽略此配置 |
| 方法 | 返回值 | 描述 |
| setImageUrl(imageUrl: String) | none | 设置图片资源的地址 |
| setSize(size: Size) | none | 设置图标可视区域的大小 |
| setImageSize(offset: Size) | none | 设置图标的大小 |
| setAnchor(anchor: Size) | none | 设置图标定位点相对于其左上角的偏移值 |
| setImageOffset(offset: Size) | none | 设置图片相对于可视区域的偏移值 |
| setInfoWindowAnchor(anchor: Size) | none | 设置信息窗口开启位置相对于图标左上角的偏移值 |
| setPrintImageUrl(url: String) | none | 设置icon的打印图片，该打印图片只针对IE6有效，解决IE6使用PNG滤镜导致的错位问题。如果您的icon没有使用PNG格式图片或者没有使用CSS Sprites技术，则可忽略此配置 |
Point: 此类表示一个地理坐标点。（常用）
| 构造函数 | 描述 |
| Point(lng: Number, lat: Number) | 以指定的经度和纬度创建一个地理点坐标 |
| 属性 | 类型 | 描述 |
| lng | Number | 地理经度 |
| lat | Number | 地理纬度 |
| 方法 | 返回值 | 描述 |
| equals(other: Point) | Boolean | 判断坐标点是否相等，当且仅当两点的经度和纬度均相等时返回true |
Bounds: 此类表示地理坐标的矩形区域。
| 构造函数 | 描述 |
| Bounds(sw: Point, ne: Point) | 创建一个包含所有给定点坐标的矩形区域。其中sw表示矩形区域的西南角，参数ne表示矩形区域的东北角 |
| 方法 | 返回值 | 描述 |
| equals(other: Bounds) | Boolean | 当且仅当此矩形中的两点参数都等于其他矩形的两点参数时，返回true |
| containsPoint(point: Point) | Boolean | 如果点的地理坐标位于此矩形内，则返回true |
| containsBounds(bounds: Bounds) | Boolean | 传入的矩形区域完全包含于此矩形区域中，则返回true |
| intersects(other: Bounds) | Bounds | 计算与另一矩形的交集区域 |
| extend(point: Point) | none | 放大此矩形，使其包含给定的点 |
| getCenter() | Point | 返回矩形的中心点 |
| isEmpty() | Boolean | 如果矩形为空，则返回true |
| getSouthWest() | Point | 返回矩形区域的西南角 |
| getNorthEast() | Point | 返回矩形区域的东北角 |
| toSpan() | Point | 返回矩形区域的跨度 |
Size: 此类以像素表示一个矩形区域的大小。
| 构造函数 | 描述 |
| Size(width: Number, height: Number) | 以指定的宽度和高度创建一个矩形区域大小对象 |
| 属性 | 类型 | 描述 |
| width | Number | 水平方向的数值 |
| height | Number | 竖直方向的数值 |
| 方法 | 返回值 | 描述 |
| equals(other: Size) | Boolean | 当且仅当此矩形中的宽度和高度都等于其他矩形的宽度和高度时，返回true |
Polyline: 使用浏览器的矢量制图工具（如果可用）在地图上绘制折线的地图叠加层。
| 构造函数 | 描述 |
| Polyline(points: Array<Point>, opts: PolylineOptions) | 创建折线覆盖物对象 |
| 方法 | 返回值 | 描述 |
| setPath(path: Array<Point>) | none | 设置折线的点数组 |
| getPath() | Array<Point> | 返回折线的点数组 |
| setStrokeColor(color: String) | none | 设置折线的颜色 |
| getStrokeColor() | String | 返回折线的颜色 |
| setStrokeOpacity(opacity: Number) | none | 设置透明度，取值范围0 - 1 |
| getStrokeOpacity() | Number | 返回透明度 |
| setStrokeWeight(weight: Number) | none | 设置线的宽度，范围为大于等于1的整数 |
| getStrokeWeight() | Number | 返回线的宽度 |
| setStrokeStyle(style: String) | none | 设置是为实线或虚线，solid或dashed |
| getStrokeStyle() | String | 返回当前线样式状态，实线或者虚线 |
| getBounds() | Bounds | 返回覆盖物的地理区域范围 |
| enableEditing() | none | 开启编辑功能 |
| disableEditing() | none | 关闭编辑功能 |
| enableMassClear() | none | 允许覆盖物在map.clearOverlays方法中被清除 |
| disableMassClear() | none | 禁止覆盖物在map.clearOverlays方法中被清除 |
| setPositionAt(index: Number, point: Point) | none | 修改指定位置的坐标。索引index从0开始计数。例如setPointAt(2, point)代表将折线的第3个点的坐标设为point |
| getMap() | Map | 返回覆盖物所在的map对象 |
| addEventListener(event: String, handler: Function) | none | 添加事件监听函数 |
| removeEventListener(event: String, handler: Function) | none | 移除事件监听函数 |
| 事件 | 参数 | 描述 |
| click | event{type, target, point, pixel} | 点击折线后会触发此事件 |
| dblclick | event{type, target, point, pixel} | 双击折线后会触发此事件 |
| mousedown | event{type, target, point, pixel} | 鼠标在折线上按下触发此事件 |
| mouseup | event{type, target, point, pixel} | 鼠标在折线释放触发此事件 |
| mouseout | event{type, target, point, pixel} | 鼠标离开折线时触发此事件 |
| mouseover | event{type, target, point, pixel} | 当鼠标进入折线区域时会触发此事件 |
| remove | event{type, target} | 移除折线时触发 |
| lineupdate | event{type, target} | 覆盖物的属性发生变化时触发 |
PolylineOptions
此类表示Polyline构造函数的可选参数。它没有构造函数，但可通过对象字面量形式表示。
| 属性 | 类型 | 描述 |
| strokeColor | String | 折线颜色 |
| strokeWeight | Number | 折线的宽度，以像素为单位 |
| strokeOpacity | Number | 折线的透明度，取值范围0 - 1 |
| strokeStyle | String | 折线的样式，solid或dashed |
| enableMassClear | Boolean | 是否在调用map.clearOverlays清除此覆盖物，默认为true |
| enableEditing | Boolean | 是否启用线编辑，默认为false |
| enableClicking | Boolean | 是否响应点击事件，默认为true |
| icons | Array<IconSequence> | 配置贴合折线的图标 |
Polygon 此类表示一个多边形覆盖物。
| 构造函数 | 描述 |
| Polygon(points: Array<Point>, opts: PolygonOptions) | 创建多边形覆盖物 |
| 方法 | 返回值 | 描述 |
| setPath(path: Array<Point>) | none | 设置多边型的点数组 |
| getPath() | Array<Point> | 返回多边型的点数组 |
| setStrokeColor(color: String) | none | 设置多边型的边线颜色，参数为合法的CSS颜色值 |
| getStrokeColor() | String | 返回多边型的边线颜色 |
| setFillColor(color: String) | none | 设置多边形的填充颜色，参数为合法的CSS颜色值。当参数为空字符串时，折线覆盖物将没有填充效果 |
| getFillColor() | String | 返回多边形的填充颜色 |
| setStrokeOpacity(opacity: Number) | none | 设置多边形的边线透明度，取值范围0 - 1 |
| getStrokeOpacity() | Number | 返回多边形的边线透明度 |
| setFillOpacity(opacity: Number) | none | 设置多边形的填充透明度，取值范围0 - 1 |
| getFillOpacity() | Number | 返回多边形的填充透明度 |
| setStrokeWeight(weight: Number) | none | 设置多边形边线的宽度，取值为大于等于1的整数 |
| getStrokeWeight() | Number | 返回多边形边线的宽度 |
| setStrokeStyle(style: String) | none | 设置多边形边线样式为实线或虚线，取值solid或dashed |
| getStrokeStyle() | String | 返回多边形边线样式 |
| getBounds() | Bounds | 返回覆盖物的地理区域范围 |
| enableEditing() | none | 开启编辑功能 |
| disableEditing() | none | 关闭编辑功能 |
| enableMassClear() | none | 允许覆盖物在map.clearOverlays方法中被清除 |
| disableMassClear() | none | 禁止覆盖物在map.clearOverlays方法中被清除 |
| setPositionAt(index: Number, point: Point) | none | 修改指定位置的坐标。索引index从0开始计数。例如setPositionAt(2, point)代表将折线的第3个点的坐标设为point |
| getMap() | Map | 返回覆盖物所在的map对象 |
| addEventListener(event: String, handler: Function) | none | 添加事件监听函数 |
| removeEventListener(event: String, handler: Function) | none | 移除事件监听函数 |
| 事件 | 参数 | 描述 |
| click | event{type, target, point, pixel} | 点击多边形后会触发此事件 |
| dblclick | event{type, target, point, pixel} | 双击多边形后会触发此事件 |
| mousedown | event{type, target, point, pixel} | 鼠标在多边形上按下触发此事件 |
| mouseup | event{type, target, point, pixel} | 鼠标在多边形释放触发此事件 |
| mouseout | event{type, target, point, pixel} | 鼠标离开多边形时触发此事件 |
| mouseover | event{type, target, point, pixel} | 当鼠标进入多边形区域时会触发此事件 |
| remove | event{type, target} | 移除多边形时触发 |
| lineupdate | event{type, target} | 覆盖物的属性发生变化时触发 |
PolygonOptions
此类表示Polygon构造函数的可选参数。它没有构造函数，但可通过对象字面量形式表示。
| 属性 | 类型 | 描述 |
| strokeColor | String | 边线颜色 |
| fillColor | String | 填充颜色。当参数为空时，折线覆盖物将没有填充效果 |
| strokeWeight | Number | 边线的宽度，以像素为单位 |
| strokeOpacity | Number | 边线透明度，取值范围0 - 1 |
| fillOpacity | Number | 填充的透明度，取值范围0 - 1 |
| strokeStyle | String | 边线的样式，solid或dashed |
| enableMassClear | Boolean | 是否在调用map.clearOverlays清除此覆盖物，默认为true |
| enableEditing | Boolean | 是否启用线编辑，默认为false |
| enableClicking | Boolean | 是否响应点击事件，默认为true |
Circle 此类表示地图上的圆覆盖物。
| 构造函数 | 描述 |
| Circle(center: Point, radius: Number, opts: CircleOptions) | 创建圆覆盖物 |
| 方法 | 返回值 | 描述 |
| setCenter(center: Point) | none | 设置圆形的中心点坐标 |
| getCenter() | Point | 返回圆形的中心点坐标 |
| setRadius(radius: Number) | none | 设置圆形的半径，单位为米 |
| getRadius() | Number | 返回圆形的半径，单位为米 |
| getBounds() | Bounds | 返回圆形的地理区域范围 |
| setStrokeColor(color: String) | none | 设置圆形的边线颜色，参数为合法的CSS颜色值 |
| getStrokeColor() | String | 返回圆形的边线颜色 |
| setFillColor(color: String) | none | 设置圆形的填充颜色，参数为合法的CSS颜色值。当参数为空字符串时，圆形覆盖物将没有填充效果 |
| getFillColor() | String | 返回圆形的填充颜色 |
| setStrokeOpacity(opacity: Number) | none | 设置圆形的边线透明度，取值范围0 - 1 |
| getStrokeOpacity() | Number | 返回圆形的边线透明度 |
| setFillOpacity(opacity: Number) | none | 设置圆形的填充透明度，取值范围0 - 1 |
| getFillOpacity() | Number | 返回圆形的填充透明度 |
| setStrokeWeight(weight: Number) | none | 设置圆形边线的宽度，取值为大于等于1的整数 |
| getStrokeWeight() | Number | 返回圆形边线的宽度 |
| setStrokeStyle(style: String) | none | 设置圆形边线样式为实线或虚线，取值solid或dashed |
| getStrokeStyle() | String | 返回圆形边线样式 |
| enableEditing() | none | 开启编辑功能 |
| disableEditing() | none | 关闭编辑功能 |
| enableMassClear() | none | 允许覆盖物在map.clearOverlays方法中被清除 |
| disableMassClear() | none | 禁止覆盖物在map.clearOverlays方法中被清除 |
| getMap() | Map | 返回覆盖物所在的map对象 |
| addEventListener(event: String, handler: Function) | none | 添加事件监听函数 |
| removeEventListener(event: String, handler: Function) | none | 移除事件监听函数 |
| 事件 | 参数 | 描述 |
| click | event{type, target, point, pixel} | 鼠标点击圆形后会触发此事件 |
| dblclick | event{type, target, point, pixel} | 鼠标双击圆形后会触发此事件 |
| mousedown | event{type, target, point, pixel} | 鼠标在圆形上按下触发此事件 |
| mouseup | event{type, target, point, pixel} | 鼠标在圆形释放触发此事件 |
| mouseout | event{type, target, point, pixel} | 鼠标离开圆形时触发此事件 |
| mouseover | event{type, target, point, pixel} | 当鼠标进入圆形区域时会触发此事件 |
| remove | event{type, target} | 移除圆形时触发此事件 |
| lineupdate | event{type, target} | 圆形覆盖物的属性发生变化时触发此事件 |
CircleOptions
Circle类构造函数的可选参数。它没有构造函数，但可通过对象字面量形式表示。
| 属性 | 类型 | 描述 |
| strokeColor | String | 圆形边线颜色 |
| fillColor | String | 圆形填充颜色。当参数为空时，圆形将没有填充效果 |
| strokeWeight | Number | 圆形边线的宽度，以像素为单位 |
| strokeOpacity | Number | 圆形边线透明度，取值范围0 - 1 |
| fillOpacity | Number | 圆形填充的透明度，取值范围0 - 1 |
| strokeStyle | String | 圆形边线的样式，solid或dashed |
| enableMassClear | Boolean | 是否在调用map.clearOverlays清除此覆盖物，默认为true |
| enableEditing | Boolean | 是否启用线编辑，默认为false |
| enableClicking | Boolean | 是否响应点击事件，默认为true |
右键菜单类
ContextMenu 此类表示右键菜单。您可以在地图上添加自定义内容的右键菜单。
| 构造函数 | 描述 |
| ContextMenu() | 创建一个右键菜单实例 |
| 方法 | 返回值 | 描述 |
| addItem(item: MenuItem) | none | 添加菜单项 |
| getItem(index: Number) | MenuItem | 返回指定索引位置的菜单项，第一个菜单项的索引为0 |
| removeItem(item: MenuItem) | none | 移除菜单项 |
| addSeparator() | none | 添加分隔符 |
| removeSeparator(index: Number) | none | 移除指定索引位置的分隔符，第一个分隔符的索引为0 |
| 事件 | 参数 | 描述 |
| open | event{type, target, point, pixel} | 右键菜单打开时触发，事件参数point和pixel分别表示菜单开启时的地理和像素坐标点 |
| close | event{type, target, point, pixel} | 右键菜单关闭时触发，事件参数point和pixel分别表示菜单开启时的地理和像素坐标点 |
MenuItem 此类表示一个菜单项。
| 构造函数 | 描述 |
| MenuItem(text: String, callback: Function, opts: MenuItemOptions) | 创建一个菜单项。当菜单项被点击时，系统将会以当前菜单弹出的地理坐标点作为参数调用回调函数callback |
| 方法 | 返回值 | 描述 |
| setText(text: String) | none | 设置菜单项显示的文本 |
| setIcon(iconUrl: String) | none | 设置菜单项的icon |
| enable() | none | 启用菜单项 |
| disable() | none | 禁用菜单项 |
MenuItemOptions 此类表示MenuItem构造函数的可选参数。它没有构造函数，但可通过对象字面量形式表示。
| 属性 | 类型 | 描述 |
| width | Number | 指定此菜单项的宽度，菜单以最长的菜单项宽度为准 |
| id | String | 指定此菜单项dom的id |
| iconUrl | String | ContextMenuIcon | 指定此菜单项的icon URL（大小为17px*17px） |
百度地图地图API(常用)相关推荐
- 百度地图 JavaScript API
文章目录 1.账号申请 2.创建应用 3.使用地图 介绍 示例 4.具体使用 控件 个性地图 带高度的点(标记地点.覆盖物) 点击事件 参考资料: 入门百度地图 JavaScript API | 8月 ...
- 百度离线地图API2.0 百度离线地图api,已经修改源码
百度离线地图API2.0 百度离线地图api,已经修改源码,绕过服务端验证,除了路书等需要服务端数据支持的功能外,其余功能已经全部实现,包括常用的:地图示例.地图控件添加.覆盖物添加.信息窗口展示等等 ...
- WPF技术触屏上的应用系列（二）: 嵌入百度地图、API调用及结合本地数据库在地图上进行自定义标点的实现...
原文:WPF技术触屏上的应用系列(二): 嵌入百度地图.API调用及结合本地数据库在地图上进行自定义标点的实现 去年某客户单位要做个大屏触屏应用,要对档案资源进行展示之用.客户端是Window7操作系 ...
- 高德h5地图api接口_html5通过腾讯地图、高德地图、百度地图开发api接口获取坐标对应的周边信息...
在通过 geolocation 获取到当前的 GPS 坐标后,需要通过"逆地理位置解析"才能得到街道对应的街道.建筑物.周边等相关信息. 下面我使用国内的三家主要的地图厂商(腾讯地 ...
- 前端的百度地图的api的使用
1.打开百度地图官方api网页 http://lbsyun.baidu.com/ 2.点击开发文档 3.选择对应的api 4.点击DEMO详情 5.得到源码复制到你的代码中 1 <!DOCTYP ...
- 百度地图JavaScript API覆盖物旋转时出现偏移
在项目中,调用百度地图JavaScript API,做覆盖物的旋转再添加到地图上,结果出现偏移了. 调试过程中的效果图: 发现图片的旋转并不是按车子的中心来的,而是之外的一个点.最后发现犯了一个很细节 ...
- html5 百度地图api文档,开发指南--百度地图JavaScript API大众版.doc
开发指南--百度地图JavaScriptAPI大众版开发指南--百度地图JavaScriptAPI大众版 简介 JavaScript API大众版 JavaScript API功能介绍 百度地图Jav ...
- 根据百度地图的api自动获取地理位置
功能:根据百度地图的api 版本:php版本 步骤1:百度地图api使用方式,获取地理位置信息 function get_address($ip){$url = "http://api.ma ...
- mysql geocode_百度地图Geocoding API获取特定地区或地址的经纬度信息，然后在MySql数据库多表循环遍历更新...
1.数据库多表循环更新的思想在这个链接上,标题是"MySql多表循环遍历更新", 链接地址http://www.cnblogs.com/litao4047/archive/2013 ...
- 关于百度地图js api的getCurrentPosition定位不准确的解决方法
关于百度地图js api的getCurrentPosition定位不准确的解决方法 参考文章: (1)关于百度地图js api的getCurrentPosition定位不准确的解决方法 (2)http ...
最新文章
- 没学过编程能学python吗_没有编程基础，可以自学Python吗？
- The Annotated Transformer
- ASP.NET 2.0个性化配置（profile）
- 如何使用wordnet
- 分析C#中Dialog控件(转)
- NET中所有的功能快捷键
- Idea 中使用Lombok 编译报找不到符号
- mapminmax函数
- 临时的实验课记录+研究的代码+计算机文档目录管理
- Vendor Model的使用
- EditText修改软键盘输入法的Enter键的按钮文字
- 如何使用kindle看代码？linux下的简单方法
- 在Excel中如何把每三行数据合并为一行？
- 产品：“写个banner这么费劲？”
- errcode.php,errCode.php
- 题—送外卖2(最短路径dfs)
- 成功，取决于你和什么样的人在一起
- 骗子QQ 14258588665 买ig骗我2600
- 博客系统（页面设计）
- 华为云obs跨域问题
热门文章
- 华为云/dev/vdb磁盘挂载
- 华为云centOS8部署
- 大白话C++：新手入门教程（附源码及详解、视频课程资料推荐）
- Partitioning big graph with respect to arbitrary proportions in a streaming manner 菜鸟解读
- Task already scheduled or cancelled（用Timer,TimeTask实现定时器功能）
- matlab 内存不足
- 计算机里比较器原理,数值比较器,数值比较器的作用和原理是 - 电子发烧友网...
- golang的chan有趣用法
- 基于Esp8266的远程开机棒设计和实现
- jqfactor_analyzer源代码解读01