类 BMapLib.DrawingManager___百度地图API

最新推荐文章于 2025-07-14 18:16:47 发布

转载最新推荐文章于 2025-07-14 18:16:47 发布 · 1.3w 阅读

本文介绍BMapLib.DrawingManager类的使用方法，包括如何开启和关闭绘制模式、设置绘制类型、添加工具栏控件及事件监听等。提供详细的构造函数参数说明及方法、事件的使用示例。

类 BMapLib.DrawingManager

鼠标绘制管理类，实现鼠标绘制管理的入口。实例化该类后，即可调用该类提供的open 方法开启绘制模式状态。也可加入工具栏进行选择操作。
源文件: DrawingManager.js.

类

类	描述
BMapLib.DrawingManager(map, opts)	DrawingManager类的构造函数

方法

方法	返回值	描述
close()		关闭地图的绘制状态
disableCalculate()		关闭距离或面积计算
enableCalculate()		打开距离或面积计算
getDrawingMode()	DrawingType	获取当前的绘制模式
open()		开启地图的绘制模式
setDrawingMode(DrawingType)	Boolean	设置当前的绘制模式，参数DrawingType，为5个可选常量: BMAP_DRAWING_MARKER 画点 BMAP_DRAWING_CIRCLE 画圆 BMAP_DRAWING_POLYLINE 画线 BMAP_DRAWING_POLYGON 画多边形 BMAP_DRAWING_RECTANGLE 画矩形

事件

事件	参数	描述
circlecomplete(overlay)	{Circle}	绘制圆完成后，派发的事件接口
markercomplete(overlay)	{Marker}	绘制点完成后，派发的事件接口
overlaycomplete(e)	{Event Object}	鼠标绘制完成后，派发总事件的接口
polygoncomplete(overlay)	{Polygon}	绘制多边形完成后，派发的事件接口
polylinecomplete(overlay)	{Polyline}	绘制线完成后，派发的事件接口
rectanglecomplete(overlay)	{Polygon}	绘制矩形完成后，派发的事件接口

类

BMapLib.DrawingManager(map, opts)

DrawingManager类的构造函数

参考示例：

var map = new BMap.Map("container");
map.centerAndZoom(new BMap.Point(116.404, 39.915), 15);

var myDrawingManagerObject = new BMapLib.DrawingManager(map, {isOpen: true, 
    drawingType: BMAP_DRAWING_MARKER, enableDrawingTool: true,
    enableCalculate: false,
    drawingToolOptions: {
        anchor: BMAP_ANCHOR_TOP_LEFT,
        offset: new BMap.Size(5, 5),
        drawingTypes : [
            BMAP_DRAWING_MARKER,
            BMAP_DRAWING_CIRCLE,
            BMAP_DRAWING_POLYLINE,
            BMAP_DRAWING_POLYGON,
            BMAP_DRAWING_RECTANGLE 
         ]
    },
    polylineOptions: {
        strokeColor: "#333"
    });

参数: {Map} map

Baidu map的实例对象

{Json Object} opts

可选的输入参数，非必填项。可输入选项包括：
{" isOpen" : {Boolean} 是否开启绘制模式
" enableDrawingTool" : {Boolean} 是否添加绘制工具栏控件，默认不添加
" drawingToolOptions" : {Json Object} 可选的输入参数，非必填项。可输入选项包括
      " anchor" : {ControlAnchor} 停靠位置、默认左上角
      " offset" : {Size} 偏移值。
      " scale" : {Number} 工具栏的缩放比例,默认为1
      " drawingModes" : {DrawingType} 工具栏上可以选择出现的绘制模式,将需要显示的DrawingType以数组型形式传入，如[BMAP_DRAWING_MARKER, BMAP_DRAWING_CIRCLE] 将只显示画点和画圆的选项
" enableCalculate" : {Boolean} 绘制是否进行测距(画线时候)、测面(画圆、多边形、矩形)
" markerOptions" : {CircleOptions} 所画的点的可选参数，参考api中的对应类
" circleOptions" : {CircleOptions} 所画的圆的可选参数，参考api中的对应类
" polylineOptions" : {CircleOptions} 所画的线的可选参数，参考api中的对应类
" polygonOptions" : {PolygonOptions} 所画的多边形的可选参数，参考api中的对应类
" rectangleOptions" : {PolygonOptions} 所画的矩形的可选参数，参考api中的对应类

方法详述

close()

关闭地图的绘制状态

参考示例：

myDrawingManagerObject.close();

disableCalculate()

关闭距离或面积计算

参考示例：

myDrawingManagerObject.disableCalculate();

enableCalculate()

打开距离或面积计算

参考示例：

myDrawingManagerObject.enableCalculate();

{DrawingType} getDrawingMode()

获取当前的绘制模式

参考示例：

alert(myDrawingManagerObject.getDrawingMode());

返回值:

{DrawingType} 绘制的模式

open()

开启地图的绘制模式

参考示例：

myDrawingManagerObject.open();

{Boolean} setDrawingMode(DrawingType)

设置当前的绘制模式，参数DrawingType，为5个可选常量:
BMAP_DRAWING_MARKER 画点
BMAP_DRAWING_CIRCLE 画圆
BMAP_DRAWING_POLYLINE 画线
BMAP_DRAWING_POLYGON 画多边形
BMAP_DRAWING_RECTANGLE 画矩形

参考示例：

myDrawingManagerObject.setDrawingMode(BMAP_DRAWING_POLYLINE);

参数: {DrawingType} DrawingType

返回值:

{Boolean}

事件详述

circlecomplete(overlay)

绘制圆完成后，派发的事件接口

参数: {Circle} overlay

回调函数会返回相应的覆盖物，
{" overlay : {Circle}

markercomplete(overlay)

绘制点完成后，派发的事件接口

参考示例：
myDrawingManagerObject.addEventListener("circlecomplete", function(e, overlay) {
    alert(overlay);
});

参数: {Marker} overlay

回调函数会返回相应的覆盖物，
{" overlay : {Marker}

overlaycomplete(e)

鼠标绘制完成后，派发总事件的接口

参考示例：
myDrawingManagerObject.addEventListener("overlaycomplete", function(e) {
    alert(e.drawingMode);
    alert(e.overlay);
    alert(e.calculate);
    alert(e.label);
});

参数: {Event Object} e

回调函数会返回event参数，包括以下返回值：
{" drawingMode : {DrawingType} 当前的绘制模式
" overlay：{Marker||Polyline||Polygon||Circle} 对应的绘制模式返回对应的覆盖物
" calculate：{Number} 需要开启计算模式才会返回这个值，当绘制线的时候返回距离、绘制多边形、圆、矩形时候返回面积，单位为米，
" label：{Label} 计算面积时候出现在Map上的Label对象

polygoncomplete(overlay)

绘制多边形完成后，派发的事件接口

参数: {Polygon} overlay

回调函数会返回相应的覆盖物，
{" overlay : {Polygon}

polylinecomplete(overlay)

绘制线完成后，派发的事件接口

参数: {Polyline} overlay

回调函数会返回相应的覆盖物，
{" overlay : {Polyline}

rectanglecomplete(overlay)

绘制矩形完成后，派发的事件接口

参数: {Polygon} overlay

回调函数会返回相应的覆盖物，
{" overlay : {Polygon}