需求 :在使用地图API时,绘制工具栏控件想自己选择哪些要,哪些不要。

可以查看相应的类:官网地址: http://api.map.baidu.com/library/DrawingManager/1.4/docs/symbols/BMapLib.DrawingManager.html#constructor

{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} 所画的点的可选参数
"circleOptions" : {CircleOptions} 所画的圆的可选参数
"polylineOptions" : {CircleOptions} 所画的线的可选参数
"polygonOptions" : {PolygonOptions} 所画的多边形的可选参数
"rectangleOptions" : {PolygonOptions} 所画的矩形的可选参数

如何使用:

//实例化鼠标绘制工具
var drawingManager = new BMapLib.DrawingManager(map, {
isOpen: false, //是否开启绘制模式
enableDrawingTool: true, //是否显示工具栏
drawingToolOptions: {
anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
offset: new BMap.Size(20, 20), //偏离值
/!* drawingModes : [BMAP_DRAWING_MARKER, BMAP_DRAWING_CIRCLE],*!/
drawingModes : [BMAP_DRAWING_RECTANGLE,BMAP_DRAWING_CIRCLE], //设置只显示画矩形、圆的模式
        drawingTypes : [
BMAP_DRAWING_MARKER,//点的样式
BMAP_DRAWING_CIRCLE,//圆的样式
BMAP_DRAWING_POLYLINE,//线的样式
BMAP_DRAWING_POLYGON,//多边形的样式
BMAP_DRAWING_RECTANGLE //矩形的样式
]
},
circleOptions: styleOptions, //圆的样式
polylineOptions: styleOptions, //线的样式
polygonOptions: styleOptions, //多边形的样式
rectangleOptions: styleOptions //矩形的样式
});
修改前默认工具控件都存在:如图:

修改后:

												

百度地图API示例:鼠标绘制点线面 控件修改的更多相关文章

  1. 百度地图API示例之设置级别setZoom与禁止拖拽disableDragging

    百度地图API示例之设置级别setZoom与禁止拖拽disableDragging 设置级别 <html> <head> <meta http-equiv="C ...

  2. 百度地图API示例之添加/删除工具条、比例尺控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  3. 百度地图API示例之添加定位相关控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  4. 百度地图API示例之添加自定义控件

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  5. 百度地图API示例之移动地图

    级别为6 级别为8 级别为12 代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Conten ...

  6. 百度地图API示例之根据城市名设置地图中心点

    代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" con ...

  7. 百度地图API示例之设置地图最大、最小级别

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  8. 百度地图API示例之设置地图显示范围

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

  9. 百度地图API示例之文本标注

    代码 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont ...

随机推荐

  1. nodejs安装、环境配置和测试

    nodejs下载 https://nodejs.org/en/ nodejs安装 双击下载的nodejs,可自定义安装路径,安装模块部分直接next即可安装. 检查是否安装 win+R输入cmd,打开 ...

  2. laravel安装Excel安装不上

    1.生明版本号 composer require maatwebsite/excel 2.1我的PHP是7.0安装Excel得2.1 2.在composer.json中加入 "maatweb ...

  3. 0.1.2 max_element和min_element的用法

    找到的位置都是第一个最大(小)的元素,即存在多个相同大小的元素的时候找到的是第一个. 返回的是指针(元素地址). printf("%d\n",*max_element(a,a+n) ...

  4. shiro会话管理

    Shiro提供了完整的企业级会话管理功能,不依赖于底层容器(如web容器tomcat),不管JavaSE还是JavaEE环境都可以使用,提供了会话管理.会话事件监听.会话存储/持久化.容器无关的集群. ...

  5. css单位分析、颜色设置与调色板

    CSS单位分析 px:单位代表像素,1px代表一个像素点. %:设置子元素为父容器的占比. em:代表该元素中一个字体所占字符,常用在文字首行缩进.其具有继承性. rem:始终代表html中的字符所在 ...

  6. phpStorm中Structure窗口中的符号代表的意思

    参考:https://www.jetbrains.com/help/phpstorm/2016.3/symbols.html Icon   Description Class 类 Final clas ...

  7. Python函数基础-函数调用,定义,参数,递归

    Python内置了很多函数供调用,eg 求绝对值函数abs() >>>abs(-1) 1 >>>abs(1) 求和函数sum(),sum(iterable,star ...

  8. [CodeForces - 197E] E - Paint Tree

    E - Paint Tree You are given a tree with n vertexes and n points on a plane, no three points lie on ...

  9. img 标签

    设计网页时经常使用的图片有三种,它们的相同点是都经过了压缩,压缩比越高,图像品质越差. GIF(Graphics Interchange Format):最多支持256色,支持透明,支持多帧动画显示效 ...

  10. OpenJDK换为JDK(CentOS)

    说明:应该来说没必要非把OpenJDK卸载掉,只要让$PATH中我们安装的jdk的目录较OpenJDK所在的/usr/bin先出现就好了:简言之跳过下边的第一步直接从第二步开始更科学一些. 1.卸载O ...