Drawing Library

DrawingManager 類別

google.maps.drawing.DrawingManager class
extends MVCObject
library "drawing"

可讓使用者在地圖上繪製標記、多邊形、折線、矩形和圓形。DrawingManager 的繪圖模式會定義使用者建立的疊加層類型。在地圖中加入控制項，讓使用者切換繪圖模式。

const {DrawingManager} = await google.maps.importLibrary("drawing");
DrawingManager
DrawingManager([options])
參數：
建立 DrawingManager，讓使用者在地圖上繪製疊加層，並使用繪圖控制項切換要繪製的疊加層類型。
getDrawingMode
getDrawingMode()
參數：無
傳回值： OverlayType|null
傳回 DrawingManager 的繪圖模式。
getMap
getMap()
參數：無
傳回值： Map|null
傳回 DrawingManager 附加的 Map，也就是建立的疊加層會放置在該 Map 上。
setDrawingMode
setDrawingMode(drawingMode)
參數：
傳回值：無
變更 DrawingManager 的繪圖模式，定義要新增至地圖的疊加層類型。可接受的值為 'marker'、'polygon'、'polyline'、'rectangle'、'circle' 或 null。如果繪圖模式為 null，表示使用者可以正常與地圖互動，且點選不會繪製任何內容。
setMap
setMap(map)
參數：
  • map：Map optional
傳回值：無
將 DrawingManager 物件附加至指定的 Map。
setOptions
setOptions(options)
參數：
傳回值：無
設定 DrawingManager 的選項。
繼承： addListener、bindTo、get、notify、set、setValues、unbind、unbindAll
circlecomplete
function(circle)
引數：
  • circle：Circle optional 使用者剛畫的圓圈。
使用者完成繪製圓形時，就會觸發這個事件。
markercomplete
function(marker)
引數：
  • marker：Marker 使用者剛繪製的標記。
使用者完成繪製標記時，就會觸發這個事件。
overlaycomplete
function(event)
引數：
  • event：OverlayCompleteEvent optional 使用者剛繪製的疊加層，以及疊加層的類型。
使用者完成繪製任何類型的疊加層時，就會觸發這個事件。
polygoncomplete
function(polygon)
引數：
  • polygon：Polygon 使用者剛繪製的多邊形。
使用者完成繪製多邊形時，就會觸發這個事件。
polylinecomplete
function(polyline)
引數：
  • polyline：Polyline optional 使用者剛繪製的折線。
使用者完成繪製折線時，就會觸發這個事件。
rectanglecomplete
function(rectangle)
引數：
  • rectangle：Rectangle optional 使用者剛繪製的矩形。
使用者完成繪製矩形時，就會觸發這個事件。

DrawingManagerOptions 介面

google.maps.drawing.DrawingManagerOptions 介面

繪圖管理員的選項。
circleOptions
選填
類型： CircleOptions optional
使用這個DrawingManager建立新圓圈時，可套用的選項。系統會忽略 center 和 radius 屬性，且新圓形的 map 屬性一律會設為 DrawingManager 的地圖。
drawingControl
選填
類型： boolean optional
預設值： true
繪圖控制項的啟用/停用狀態。
drawingControlOptions
選填
類型： DrawingControlOptions optional
繪圖控制項的顯示選項。
drawingMode
選填
類型： OverlayType optional
DrawingManager 的繪圖模式，定義要新增至地圖的疊加層類型。可接受的值為 'marker'、'polygon'、'polyline'、'rectangle'、'circle' 或 null。如果繪圖模式為 null，表示使用者可以正常與地圖互動，且點選不會繪製任何內容。
map
選填
類型： Map optional
DrawingManager 附加到的 Map，也就是建立的疊加層會放置在該 Map 上。
markerOptions
選填
類型： MarkerOptions optional
要套用至任何以這個 DrawingManager 建立的新標記的選項。系統會忽略 position 屬性，且新標記的 map 屬性一律會設為 DrawingManager 的地圖。
polygonOptions
選填
類型： PolygonOptions optional
要套用至使用這個 DrawingManager 建立的任何新多邊形的選項。系統會忽略 paths 屬性，且新多邊形的 map 屬性一律會設為 DrawingManager 的地圖。
polylineOptions
選填
類型： PolylineOptions optional
要套用至使用這個 DrawingManager 建立的任何新折線的選項。系統會忽略 path 屬性，且新折線的 map 屬性一律會設為 DrawingManager 的地圖。
rectangleOptions
選填
類型： RectangleOptions optional
使用這個 DrawingManager 建立任何新矩形時，可套用的選項。系統會忽略 bounds 屬性，且新矩形的 map 屬性一律會設為 DrawingManager 的地圖。

DrawingControlOptions 介面

google.maps.drawing.DrawingControlOptions 介面

繪圖控制項的算繪選項。
drawingModes
選填
類型： Array<OverlayType> optional
預設值： [OverlayType.MARKER, OverlayType.POLYLINE, OverlayType.RECTANGLE, OverlayType.CIRCLE, OverlayType.POLYGON]
繪圖控制項中顯示的繪圖模式，按照顯示順序排列。手形圖示 (對應 null 繪圖模式) 一律會顯示，不須在這個陣列中指定。
position
選填
類型： ControlPosition optional
預設值： ControlPosition.TOP_LEFT
位置 ID。用於指定地圖上控制項的位置。

OverlayCompleteEvent 介面

google.maps.drawing.OverlayCompleteEvent 介面

DrawingManager 上 overlaycomplete 事件的屬性。
overlay
完成的疊加層。
type
類型： OverlayType
已完成的疊加層類型。

OverlayType 常數

google.maps.drawing.OverlayType constants
程式庫"drawing"

DrawingManager 可能建立的疊加層類型。請依值或使用常數名稱指定這些值。例如 'polygon' 或 google.maps.drawing.OverlayType.POLYGON。

這些常數也可以做為字串使用。在 TypeScript 中，字串常值是由 OverlayTypeString 類型定義。

const {OverlayType} = await google.maps.importLibrary("drawing");
CIRCLE 指定 DrawingManager 建立圓形，且 overlaycomplete 事件中提供的疊加層是圓形。
MARKER 指定 DrawingManager 建立標記，且 overlaycomplete 事件中提供的疊加層是標記。
POLYGON 指定 DrawingManager 建立多邊形，且 overlaycomplete 事件中提供的疊加層是多邊形。
POLYLINE 指定 DrawingManager 建立折線，且 overlaycomplete 事件中提供的疊加層是折線。
RECTANGLE 指定 DrawingManager 建立矩形，且 overlaycomplete 事件中提供的疊加層是矩形。