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
แสดงผล Map ที่แนบ DrawingManager ไว้ ซึ่งเป็น 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
Map ที่แนบ DrawingManager ซึ่งเป็น 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
รหัสตำแหน่ง ใช้เพื่อระบุตำแหน่งของตัวควบคุมบนแผนที่

อินเทอร์เฟซ OverlayCompleteEvent

google.maps.drawing.OverlayCompleteEvent อินเทอร์เฟซ

พร็อพเพอร์ตี้ของเหตุการณ์ overlaycomplete ใน DrawingManager
overlay
ประเภท: Marker|Polygon|Polyline|Rectangle|Circle
การวางซ้อนที่เสร็จสมบูรณ์
type
ประเภท: OverlayType
ประเภทของโอเวอร์เลย์ที่เสร็จสมบูรณ์

ค่าคงที่ OverlayType

google.maps.drawing.OverlayType ค่าคงที่
ไลบรารี "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 เป็นสี่เหลี่ยมผืนผ้า