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
ประเภท:  MVCArray<MVCArray<LatLng>>|MVCArray<LatLng>|Array<Array<