百度地圖API:繪製工具欄控制元件 修改

common_util發表於2016-09-19

需求 :在使用地圖API時,繪製工具欄控制元件想自己選擇哪些要,哪些不要

解決步驟如下:

參考官網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, //是否顯示工具欄
                    enableCalculate: false,
                    drawingToolOptions: {
                        anchor: BMAP_ANCHOR_TOP_RIGHT, //位置
                        offset: new BMap.Size(5, 5), //偏離值
                     drawingModes : [BMAP_DRAWING_MARKER, BMAP_DRAWING_CIRCLE],
                      drawingTypes : [
                                    BMAP_DRAWING_MARKER,  
                                    BMAP_DRAWING_CIRCLE,//圓的樣式
//////                                  BMAP_DRAWING_POLYLINE,
//////                                  BMAP_DRAWING_POLYGON,
////                                    BMAP_DRAWING_RECTANGLE //矩形的樣式
                            ]
                    },
                });

新增前,和新增後的頁面顯示效果如下:





相關文章