Polygons

Polyline class

google.maps.Polyline ชั้นเรียน

เส้นประกอบคือการวางซ้อนเชิงเส้นของส่วนเส้นที่เชื่อมต่อกันบนแผนที่

ชั้นเรียนนี้ขยายเวลา MVCObject

เข้าถึงได้โดยโทรไปที่ const {Polyline} = await google.maps.importLibrary("maps")
ดูไลบรารีใน Maps JavaScript API

Polyline
Polyline([opts])
พารามิเตอร์: 
สร้างเส้นหลายเส้นโดยใช้ PolylineOptions ที่ส่งผ่าน ซึ่งจะระบุทั้งเส้นทางของเส้นหลายเส้นและรูปแบบการขีดเส้นที่จะใช้เมื่อวาดเส้นหลายเส้น คุณอาจส่งอาร์เรย์ของ LatLng หรือ MVCArray ของ LatLng เมื่อสร้างเส้นหลายเส้น แม้ว่าระบบจะแปลงอาร์เรย์ธรรมดาเป็น MVCArray ภายในเส้นหลายเส้นเมื่อมีการเริ่มต้นอินสแตนซ์
getDraggable
getDraggable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่าผู้ใช้ลากรูปร่างนี้ได้หรือไม่
getEditable
getEditable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่าผู้ใช้แก้ไขรูปร่างนี้ได้หรือไม่
getMap
getMap()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  Map|null
แสดงแผนที่ที่แนบรูปร่างนี้
getPath
getPath()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  MVCArray<LatLng>
ดึงข้อมูลเส้นทาง
getVisible
getVisible()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่ารูปหลายเหลี่ยมนี้มองเห็นได้ในแผนที่หรือไม่
setDraggable
setDraggable(draggable)
พารามิเตอร์: 
  • draggableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะลากรูปร่างนี้ไปไว้เหนือแผนที่ได้ พร็อพเพอร์ตี้ geodesic จะกำหนดโหมดการลาก
setEditable
setEditable(editable)
พารามิเตอร์: 
  • editableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขรูปร่างนี้ได้โดยการลากจุดควบคุมที่แสดงที่จุดยอดและในแต่ละส่วน
setMap
setMap(map)
พารามิเตอร์: 
  • mapMap optional
ค่าที่ส่งคืน: ไม่มี
แสดงรูปร่างนี้บนแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำรูปร่างออก
setOptions
setOptions(options)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
setPath
setPath(path)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าเส้นทาง ดูรายละเอียดเพิ่มเติมได้ที่ PolylineOptions
setVisible
setVisible(visible)
พารามิเตอร์: 
  • visibleboolean
ค่าที่ส่งคืน: ไม่มี
ซ่อนรูปหลายเหลี่ยมนี้หากตั้งค่าเป็น false
สืบทอด: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
click
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์คลิก DOM เริ่มทำงานใน Polyline
contextmenu
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ contextmenu ของ DOM เริ่มทำงานใน Polyline
dblclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ dblclick ของ DOM เริ่มทำงานใน Polyline
drag
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้ซ้ำๆ ขณะที่ผู้ใช้ลากเส้นหลายส่วน
dragend
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้หยุดลากเส้นหลายส่วน
dragstart
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้เริ่มลากเส้นหลายเส้น
mousedown
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mousedown เริ่มทำงานใน Polyline
mousemove
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อมีการทริกเกอร์เหตุการณ์ DOM mousemove ใน Polyline
mouseout
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเมาส์ออกจาก Polyline
mouseover
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อวางเมาส์เหนือเส้นหลายส่วน
mouseup
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mouseup เริ่มทำงานใน Polyline
rightclick
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อคลิกขวาที่ Polyline

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

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

ออบเจ็กต์ PolylineOptions ที่ใช้กำหนดพร็อพเพอร์ตี้ที่ตั้งค่าใน Polyline ได้

clickable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
ระบุว่า Polyline จัดการเหตุการณ์ของเมาส์หรือไม่
draggable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะลากรูปร่างนี้ไปไว้เหนือแผนที่ได้ พร็อพเพอร์ตี้ geodesic จะกำหนดโหมดการลาก
editable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขรูปร่างนี้ได้โดยการลากจุดควบคุมที่แสดงที่จุดยอดและในแต่ละส่วน
geodesic optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
เมื่อ true ขอบของรูปหลายเหลี่ยมจะได้รับการตีความเป็นเส้นโค้งบนพื้นผิวโลกและจะโค้งตามความโค้งของโลก เมื่อ false ขอบของรูปหลายเหลี่ยมจะแสดงเป็นเส้นตรงในพื้นที่หน้าจอ โปรดทราบว่ารูปร่างของรูปหลายเหลี่ยมแบบ Geodesic อาจดูเปลี่ยนไปเมื่อลาก เนื่องจากขนาดจะคงไว้โดยสัมพันธ์กับพื้นผิวโลก
icons optional
ประเภท:  Array<IconSequence> optional
ไอคอนที่จะแสดงผลตามเส้นประกอบ
map optional
ประเภท:  Map optional
แผนที่ที่จะแสดงเส้นประกอบ
path optional
ประเภท:  MVCArray<LatLng>|Array<LatLng|LatLngLiteral> optional
ลำดับพิกัดของ Polyline คุณระบุเส้นทางนี้ได้โดยใช้ทั้งอาร์เรย์แบบง่ายของ LatLng หรือ MVCArray ของ LatLng โปรดทราบว่าหากคุณส่งอาร์เรย์ธรรมดา ระบบจะแปลงอาร์เรย์นั้นเป็น MVCArray การแทรกหรือนำ LatLng ออกใน MVCArray จะอัปเดตเส้นหลายส่วนในแผนที่โดยอัตโนมัติ
strokeColor optional
ประเภท:  string optional
สีเส้น ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
strokeOpacity optional
ประเภท:  number optional
ความทึบของเส้นขีดระหว่าง 0.0 ถึง 1.0
strokeWeight optional
ประเภท:  number optional
ความหนาของเส้นในหน่วยพิกเซล
visible optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
ไม่ว่าจะมองเห็น Polyline นี้บนแผนที่หรือไม่
zIndex optional
ประเภท:  number optional
zIndex เมื่อเทียบกับรูปหลายเหลี่ยมอื่นๆ

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

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

อธิบายวิธีแสดงไอคอนในบรรทัด

หากเส้นหลายส่วนเป็นเส้นโค้งตามพื้นผิวโลก ระบบจะคำนวณระยะทางที่ระบุสำหรับการชดเชยและการทำซ้ำทั้ง 2 อย่างเป็นเมตรโดยค่าเริ่มต้น การตั้งค่าออฟเซ็ตหรือการทำซ้ำเป็นค่าพิกเซลจะทำให้ระบบคำนวณระยะทางเป็นพิกเซลบนหน้าจอ

fixedRotation optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หาก true ไอคอนแต่ละรายการในลำดับจะมีภาพหมุนคงที่เหมือนกันโดยไม่คำนึงถึงมุมของขอบที่ไอคอนอยู่ หาก false, case ไอคอนแต่ละรายการในลำดับจะหมุนเพื่อให้สอดคล้องกับขอบ
icon optional
ประเภท:  Symbol optional
ไอคอนที่จะแสดงในบรรทัด
offset optional
ประเภท:  string optional
ค่าเริ่มต้น: '100%'
ระยะห่างจากจุดเริ่มต้นของเส้นที่จะแสดงไอคอน ระยะทางนี้อาจแสดงเป็นเปอร์เซ็นต์ของความยาวของเส้น (เช่น "50%") หรือเป็นพิกเซล (เช่น "50px")
repeat optional
ประเภท:  string optional
ค่าเริ่มต้น: 0
ระยะห่างระหว่างไอคอนที่อยู่ติดกันในบรรทัด ระยะทางนี้อาจแสดงเป็นเปอร์เซ็นต์ของความยาวของเส้น (เช่น "50%") หรือเป็นพิกเซล (เช่น "50px") หากต้องการปิดใช้การทำซ้ำไอคอน ให้ระบุ "0"

รูปหลายเหลี่ยม คลาส

google.maps.Polygon ชั้นเรียน

รูปหลายเหลี่ยม (เช่น เส้นประกอบ) จะกำหนดชุดพิกัดที่เชื่อมต่อกันในลำดับที่เรียง นอกจากนี้ รูปหลายเหลี่ยมยังสร้างลูปปิดและกำหนดพื้นที่ที่เติม ดูตัวอย่างในคู่มือสำหรับนักพัฒนาซอฟต์แวร์ โดยเริ่มจากรูปหลายเหลี่ยมแบบง่าย รูปหลายเหลี่ยมที่มีรู และอื่นๆ โปรดทราบว่าคุณยังใช้ชั้นข้อมูลเพื่อสร้างรูปหลายเหลี่ยมได้ด้วย เลเยอร์ข้อมูลช่วยให้สร้างรูได้ง่ายขึ้นเนื่องจากจะจัดการลำดับของเส้นทางด้านในและด้านนอกให้คุณ

ชั้นเรียนนี้ขยายเวลา MVCObject

เข้าถึงได้โดยโทรไปที่ const {Polygon} = await google.maps.importLibrary("maps")
ดูไลบรารีใน Maps JavaScript API

Polygon
Polygon([opts])
พารามิเตอร์: 
สร้างรูปหลายเหลี่ยมโดยใช้ PolygonOptions ที่ส่งผ่าน ซึ่งระบุเส้นทางของรูปหลายเหลี่ยม รูปแบบเส้นขอบสำหรับขอบของรูปหลายเหลี่ยม และรูปแบบการเติมสำหรับพื้นที่ภายในของรูปหลายเหลี่ยม รูปหลายเหลี่ยมอาจมีเส้นทางอย่างน้อย 1 เส้นทาง โดยแต่ละเส้นทางประกอบด้วยอาร์เรย์ของ LatLng คุณอาจส่งอาร์เรย์ของ LatLng หรือ MVCArray ของ LatLngs เมื่อสร้างเส้นทางเหล่านี้ ระบบจะแปลงอาร์เรย์เป็น MVCArray ภายในรูปหลายเหลี่ยมเมื่อสร้างอินสแตนซ์
getDraggable
getDraggable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่าผู้ใช้ลากรูปร่างนี้ได้หรือไม่
getEditable
getEditable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่าผู้ใช้แก้ไขรูปร่างนี้ได้หรือไม่
getMap
getMap()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  Map|null
แสดงแผนที่ที่แนบรูปร่างนี้
getPath
getPath()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  MVCArray<LatLng>
ดึงเส้นทางแรก
getPaths
getPaths()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  MVCArray<MVCArray<LatLng>>
ดึงเส้นทางสำหรับรูปหลายเหลี่ยมนี้
getVisible
getVisible()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่ารูปหลายเหลี่ยมนี้มองเห็นได้ในแผนที่หรือไม่
setDraggable
setDraggable(draggable)
พารามิเตอร์: 
  • draggableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะลากรูปร่างนี้ไปไว้เหนือแผนที่ได้ พร็อพเพอร์ตี้ geodesic จะกำหนดโหมดการลาก
setEditable
setEditable(editable)
พารามิเตอร์: 
  • editableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขรูปร่างนี้ได้โดยการลากจุดควบคุมที่แสดงที่จุดยอดและในแต่ละส่วน
setMap
setMap(map)
พารามิเตอร์: 
  • mapMap optional
ค่าที่ส่งคืน: ไม่มี
แสดงรูปร่างนี้บนแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำรูปร่างออก
setOptions
setOptions(options)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
setPath
setPath(path)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าเส้นทางแรก ดูรายละเอียดเพิ่มเติมได้ที่ PolygonOptions
setPaths
setPaths(paths)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าเส้นทางสำหรับรูปหลายเหลี่ยมนี้
setVisible
setVisible(visible)
พารามิเตอร์: 
  • visibleboolean
ค่าที่ส่งคืน: ไม่มี
ซ่อนรูปหลายเหลี่ยมนี้หากตั้งค่าเป็น false
สืบทอด: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
click
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อทริกเกอร์เหตุการณ์คลิก DOM ในรูปหลายเหลี่ยม
contextmenu
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM contextmenu เริ่มทำงานในรูปหลายเหลี่ยม
dblclick
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อทริกเกอร์เหตุการณ์ dblclick ของ DOM ในรูปหลายเหลี่ยม
drag
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์ซ้ำๆ ขณะที่ผู้ใช้ลากรูปหลายเหลี่ยม
dragend
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้หยุดลากรูปหลายเหลี่ยม
dragstart
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้เริ่มลากรูปหลายเหลี่ยม
mousedown
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mousedown เริ่มทำงานในรูปหลายเหลี่ยม
mousemove
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อมีการทริกเกอร์เหตุการณ์ DOM mousemove ในรูปหลายเหลี่ยม
mouseout
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเมาส์ออกจากรูปหลายเหลี่ยม
mouseover
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อวางเมาส์เหนือรูปหลายเหลี่ยม
mouseup
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mouseup เริ่มทำงานในรูปหลายเหลี่ยม
rightclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อคลิกขวาที่รูปหลายเหลี่ยม

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

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

ออบเจ็กต์ PolygonOptions ใช้เพื่อกำหนดพร็อพเพอร์ตี้ที่ตั้งค่าใน Polygon ได้

clickable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
ระบุว่า Polygon จัดการเหตุการณ์ของเมาส์หรือไม่
draggable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะลากรูปร่างนี้ไปไว้เหนือแผนที่ได้ พร็อพเพอร์ตี้ geodesic จะกำหนดโหมดการลาก
editable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขรูปร่างนี้ได้โดยการลากจุดควบคุมที่แสดงที่จุดยอดและในแต่ละส่วน
fillColor optional
ประเภท:  string optional
สีเติม ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
fillOpacity optional
ประเภท:  number optional
ความทึบของสีเติมระหว่าง 0.0 ถึง 1.0
geodesic optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
เมื่อ true ขอบของรูปหลายเหลี่ยมจะได้รับการตีความเป็นเส้นโค้งบนพื้นผิวโลกและจะโค้งตามความโค้งของโลก เมื่อ false ขอบของรูปหลายเหลี่ยมจะแสดงเป็นเส้นตรงในพื้นที่หน้าจอ โปรดทราบว่ารูปร่างของรูปหลายเหลี่ยมแบบ Geodesic อาจดูเปลี่ยนไปเมื่อลาก เนื่องจากขนาดจะคงไว้โดยสัมพันธ์กับพื้นผิวโลก
map optional
ประเภท:  Map optional
แผนที่ที่จะแสดงรูปหลายเหลี่ยม
paths optional
ลำดับของพิกัดที่กำหนดลูปปิด รูปหลายเหลี่ยมอาจประกอบด้วยเส้นทางอย่างน้อย 1 เส้นทาง ซึ่งแตกต่างจากเส้นหลายเส้น ด้วยเหตุนี้ พร็อพเพอร์ตี้เส้นทางจึงอาจระบุอาร์เรย์ของพิกัด LatLng อย่างน้อย 1 รายการ ระบบจะปิดเส้นทางโดยอัตโนมัติ คุณจึงไม่จำเป็นต้องทำซ้ำจุดยอดแรกของเส้นทางเป็นจุดยอดสุดท้าย คุณกำหนดรูปหลายเหลี่ยมแบบง่ายได้โดยใช้อาร์เรย์ของ LatLng รายการเดียว รูปหลายเหลี่ยมที่ซับซ้อนมากขึ้นอาจระบุอาร์เรย์ของอาร์เรย์ ระบบจะแปลงอาร์เรย์ธรรมดาเป็น MVCArray การแทรกหรือนำ LatLng ออกจาก MVCArray จะอัปเดตรูปหลายเหลี่ยมในแผนที่โดยอัตโนมัติ
strokeColor optional
ประเภท:  string optional
สีเส้น ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
strokeOpacity optional
ประเภท:  number optional
ความทึบของเส้นระหว่าง 0.0 ถึง 1.0
strokePosition optional
ประเภท:  StrokePosition optional
ค่าเริ่มต้น: StrokePosition.CENTER
ตำแหน่งของเส้น
strokeWeight optional
ประเภท:  number optional
ความหนาของเส้นในหน่วยพิกเซล
visible optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
รูปหลายเหลี่ยมนี้จะแสดงบนแผนที่หรือไม่
zIndex optional
ประเภท:  number optional
zIndex เมื่อเทียบกับรูปหลายเหลี่ยมอื่นๆ

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

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

ออบเจ็กต์นี้จะแสดงจากเหตุการณ์ของเมาส์ในเส้นหลายส่วนและรูปหลายเหลี่ยม

อินเทอร์เฟซนี้ขยาย MapMouseEvent

edge optional
ประเภท:  number optional
ดัชนีของขอบภายในเส้นทางใต้เคอร์เซอร์เมื่อเกิดเหตุการณ์ หากเหตุการณ์เกิดขึ้นที่จุดกึ่งกลางบนรูปหลายเหลี่ยมที่แก้ไขได้
path optional
ประเภท:  number optional
ดัชนีของเส้นทางใต้เคอร์เซอร์เมื่อเกิดเหตุการณ์ หากเหตุการณ์เกิดขึ้นที่จุดยอดและแก้ไขรูปหลายเหลี่ยมได้ หรือ undefined
vertex optional
ประเภท:  number optional
ดัชนีของจุดยอดใต้เคอร์เซอร์เมื่อเกิดเหตุการณ์ หากเหตุการณ์เกิดขึ้นที่จุดยอดและแก้ไขเส้นโพลีไลน์หรือรูปหลายเหลี่ยมได้ หากเหตุการณ์ไม่เกิดขึ้นที่จุดยอด ค่าจะเป็น undefined
สืบทอด: domEvent latLng
รับค่า: stop

Rectangle class

google.maps.Rectangle ชั้นเรียน

การวางซ้อนสี่เหลี่ยมผืนผ้า

ชั้นเรียนนี้ขยายเวลา MVCObject

เข้าถึงได้โดยโทรไปที่ const {Rectangle} = await google.maps.importLibrary("maps")
ดูไลบรารีใน Maps JavaScript API

Rectangle
Rectangle([opts])
พารามิเตอร์: 
สร้างสี่เหลี่ยมผืนผ้าโดยใช้ RectangleOptions ที่ส่งผ่าน ซึ่งระบุขอบเขตและสไตล์
getBounds
getBounds()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  LatLngBounds|null
แสดงผลขอบเขตของสี่เหลี่ยมผืนผ้านี้
getDraggable
getDraggable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงผลว่าผู้ใช้ลากสี่เหลี่ยมผืนผ้านี้ได้หรือไม่
getEditable
getEditable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่าผู้ใช้แก้ไขสี่เหลี่ยมผืนผ้านี้ได้หรือไม่
getMap
getMap()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  Map|null
แสดงแผนที่ที่แสดงสี่เหลี่ยมผืนผ้านี้
getVisible
getVisible()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงผลว่าสี่เหลี่ยมผืนผ้านี้มองเห็นได้ในแผนที่หรือไม่
setBounds
setBounds(bounds)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
กำหนดขอบเขตของสี่เหลี่ยมผืนผ้านี้
setDraggable
setDraggable(draggable)
พารามิเตอร์: 
  • draggableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะลากสี่เหลี่ยมผืนผ้านี้เหนือแผนที่ได้
setEditable
setEditable(editable)
พารามิเตอร์: 
  • editableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขสี่เหลี่ยมผืนผ้านี้ได้โดยการลากจุดควบคุมที่แสดงที่มุมและขอบแต่ละด้าน
setMap
setMap(map)
พารามิเตอร์: 
  • mapMap optional
ค่าที่ส่งคืน: ไม่มี
แสดงสี่เหลี่ยมผืนผ้าบนแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำสี่เหลี่ยมผืนผ้าออก
setOptions
setOptions(options)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
setVisible
setVisible(visible)
พารามิเตอร์: 
  • visibleboolean
ค่าที่ส่งคืน: ไม่มี
ซ่อนสี่เหลี่ยมผืนผ้านี้หากตั้งค่าเป็น false
สืบทอด: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
bounds_changed
function()
อาร์กิวเมนต์: ไม่มี
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อมีการเปลี่ยนแปลงขอบเขตของสี่เหลี่ยมผืนผ้า
click
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์คลิก DOM เริ่มทำงานบนสี่เหลี่ยมผืนผ้า
contextmenu
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM contextmenu เริ่มทำงานบนสี่เหลี่ยมผืนผ้า
dblclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ dblclick ของ DOM เริ่มทำงานบนสี่เหลี่ยมผืนผ้า
drag
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้ซ้ำๆ ขณะที่ผู้ใช้ลากสี่เหลี่ยมผืนผ้า
dragend
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้หยุดลากสี่เหลี่ยมผืนผ้า
dragstart
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้เริ่มลากสี่เหลี่ยมผืนผ้า
mousedown
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mousedown เริ่มทำงานบนสี่เหลี่ยมผืนผ้า
mousemove
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mousemove เริ่มทำงานบนสี่เหลี่ยมผืนผ้า
mouseout
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อเมาส์ออกจากสี่เหลี่ยมผืนผ้า
mouseover
function(event)
อาร์กิวเมนต์: 
ระบบจะทริกเกอร์เหตุการณ์นี้เมื่อวางเมาส์เหนือสี่เหลี่ยมผืนผ้า
mouseup
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mouseup เริ่มทำงานบนสี่เหลี่ยมผืนผ้า
rightclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อคลิกขวาที่สี่เหลี่ยมผืนผ้า

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

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

ออบเจ็กต์ RectangleOptions ใช้เพื่อกำหนดพร็อพเพอร์ตี้ที่ตั้งค่าได้ในสี่เหลี่ยมผืนผ้า

bounds optional
ประเภท:  LatLngBounds|LatLngBoundsLiteral optional
ขอบเขต
clickable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
ระบุว่า Rectangle จัดการเหตุการณ์ของเมาส์หรือไม่
draggable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะลากสี่เหลี่ยมผืนผ้านี้เหนือแผนที่ได้
editable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขสี่เหลี่ยมผืนผ้านี้ได้โดยการลากจุดควบคุมที่แสดงที่มุมและขอบแต่ละด้าน
fillColor optional
ประเภท:  string optional
สีเติม ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
fillOpacity optional
ประเภท:  number optional
ความทึบของสีเติมระหว่าง 0.0 ถึง 1.0
map optional
ประเภท:  Map optional
แผนที่ที่จะแสดงสี่เหลี่ยมผืนผ้า
strokeColor optional
ประเภท:  string optional
สีเส้น ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
strokeOpacity optional
ประเภท:  number optional
ความทึบของเส้นระหว่าง 0.0 ถึง 1.0
strokePosition optional
ประเภท:  StrokePosition optional
ค่าเริ่มต้น: StrokePosition.CENTER
ตำแหน่งของเส้น
strokeWeight optional
ประเภท:  number optional
ความหนาของเส้นในหน่วยพิกเซล
visible optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
สี่เหลี่ยมผืนผ้านี้จะแสดงบนแผนที่หรือไม่
zIndex optional
ประเภท:  number optional
zIndex เมื่อเทียบกับรูปหลายเหลี่ยมอื่นๆ

ชั้นเรียน Circle

google.maps.Circle ชั้นเรียน

วงกลมบนพื้นผิวโลก หรือที่เรียกว่า "ทรงกลม"

ชั้นเรียนนี้ขยายเวลา MVCObject

เข้าถึงได้โดยโทรไปที่ const {Circle} = await google.maps.importLibrary("maps")
ดูไลบรารีใน Maps JavaScript API

Circle
Circle([circleOrCircleOptions])
พารามิเตอร์: 
สร้างวงกลมโดยใช้ CircleOptions ที่ส่งมา ซึ่งระบุจุดศูนย์กลาง รัศมี และสไตล์
getBounds
getBounds()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  LatLngBounds|null
รับ LatLngBounds ของวงกลมนี้
getCenter
getCenter()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  LatLng|null
แสดงผลจุดศูนย์กลางของวงกลมนี้
getDraggable
getDraggable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงผลว่าผู้ใช้ลากวงกลมนี้ได้หรือไม่
getEditable
getEditable()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงว่าผู้ใช้แก้ไขวงกลมนี้ได้หรือไม่
getMap
getMap()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  Map|null
แสดงผลแผนที่ที่วงกลมนี้แสดงอยู่
getRadius
getRadius()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  number
แสดงผลรัศมีของวงกลมนี้ (เป็นเมตร)
getVisible
getVisible()
พารามิเตอร์: ไม่มี
ค่าที่ส่งคืน:  boolean
แสดงผลว่าวงกลมนี้ปรากฏในแผนที่หรือไม่
setCenter
setCenter(center)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
ตั้งค่าจุดศูนย์กลางของวงกลมนี้
setDraggable
setDraggable(draggable)
พารามิเตอร์: 
  • draggableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะลากวงกลมนี้ไปบนแผนที่ได้
setEditable
setEditable(editable)
พารามิเตอร์: 
  • editableboolean
ค่าที่ส่งคืน: ไม่มี
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขวงกลมนี้ได้โดยการลากจุดควบคุมที่แสดงตรงกลางและรอบเส้นรอบวงของวงกลม
setMap
setMap(map)
พารามิเตอร์: 
  • mapMap optional
ค่าที่ส่งคืน: ไม่มี
แสดงวงกลมบนแผนที่ที่ระบุ หากตั้งค่าแผนที่เป็น null ระบบจะนำวงกลมออก
setOptions
setOptions(options)
พารามิเตอร์: 
ค่าที่ส่งคืน: ไม่มี
setRadius
setRadius(radius)
พารามิเตอร์: 
  • radiusnumber
ค่าที่ส่งคืน: ไม่มี
ตั้งค่ารัศมีของวงกลมนี้ (หน่วยเป็นเมตร)
setVisible
setVisible(visible)
พารามิเตอร์: 
  • visibleboolean
ค่าที่ส่งคืน: ไม่มี
ซ่อนวงกลมนี้หากตั้งค่าเป็น false
สืบทอด: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
center_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อมีการเปลี่ยนแปลงจุดศูนย์กลางของวงกลม
click
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์คลิก DOM เริ่มทำงานในวงกลม
dblclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ dblclick ของ DOM เริ่มทำงานในวงกลม
drag
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานซ้ำๆ ขณะที่ผู้ใช้ลากวงกลม
dragend
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้หยุดลากวงกลม
dragstart
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อผู้ใช้เริ่มลากวงกลม
mousedown
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mousedown เริ่มทำงานในวงกลม
mousemove
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mousemove เริ่มทำงานในวงกลม
mouseout
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อเมาส์ออกจากวงกลม
mouseover
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะทริกเกอร์เมื่อวางเมาส์เหนือวงกลม
mouseup
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อเหตุการณ์ DOM mouseup เริ่มทำงานในวงกลม
radius_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะทริกเกอร์เมื่อมีการเปลี่ยนรัศมีของวงกลม
rightclick
function(event)
อาร์กิวเมนต์: 
เหตุการณ์นี้จะเริ่มทำงานเมื่อคลิกขวาที่วงกลม

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

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

ออบเจ็กต์ CircleOptions ใช้เพื่อกำหนดพร็อพเพอร์ตี้ที่ตั้งค่าในวงกลมได้

center optional
ประเภท:  LatLng|LatLngLiteral optional
ศูนย์กลางของแวดวง
clickable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
ระบุว่า Circle จัดการเหตุการณ์ของเมาส์หรือไม่
draggable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะลากวงกลมนี้ไปบนแผนที่ได้
editable optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
หากตั้งค่าเป็น true ผู้ใช้จะแก้ไขวงกลมนี้ได้โดยการลากจุดควบคุมที่แสดงตรงกลางและรอบเส้นรอบวงของวงกลม
fillColor optional
ประเภท:  string optional
สีเติม ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
fillOpacity optional
ประเภท:  number optional
ความทึบของสีเติมระหว่าง 0.0 ถึง 1.0
map optional
ประเภท:  Map optional
แผนที่ที่จะแสดงวงกลม
radius optional
ประเภท:  number optional
รัศมีเป็นเมตรบนพื้นผิวโลก
strokeColor optional
ประเภท:  string optional
สีเส้น ระบบรองรับสี CSS3 ทั้งหมด ยกเว้นสีที่มีชื่อแบบขยาย
strokeOpacity optional
ประเภท:  number optional
ความทึบของเส้นขีดระหว่าง 0.0 ถึง 1.0
strokePosition optional
ประเภท:  StrokePosition optional
ค่าเริ่มต้น: StrokePosition.CENTER
ตำแหน่งของเส้น
strokeWeight optional
ประเภท:  number optional
ความหนาของเส้นในหน่วยพิกเซล
visible optional
ประเภท:  boolean optional
ค่าเริ่มต้น: true
วงกลมนี้จะแสดงบนแผนที่หรือไม่
zIndex optional
ประเภท:  number optional
zIndex เมื่อเทียบกับรูปหลายเหลี่ยมอื่นๆ

StrokePosition ค่าคงที่

google.maps.StrokePosition ค่าคงที่

ตำแหน่งที่เป็นไปได้ของเส้นบนรูปหลายเหลี่ยม

เข้าถึงได้โดยโทรไปที่ const {StrokePosition} = await google.maps.importLibrary("maps")
ดูไลบรารีใน Maps JavaScript API

CENTER โดยเส้นจะอยู่ตรงกลางเส้นทางของรูปหลายเหลี่ยม โดยครึ่งหนึ่งของเส้นจะอยู่ภายในรูปหลายเหลี่ยม และอีกครึ่งหนึ่งจะอยู่นอกรูปหลายเหลี่ยม
INSIDE เส้นขีดอยู่ภายในรูปหลายเหลี่ยม
OUTSIDE เส้นขีดอยู่นอกรูปหลายเหลี่ยม