Info Window

InfoWindow คลาส

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

การวางซ้อนที่มีลักษณะเหมือนลูกโป่งและมักเชื่อมต่อกับเครื่องหมาย

คลาสนี้ขยายเวลา MVCObject

คุณเข้าถึงได้โดยโทรหา const {InfoWindow} = await google.maps.importLibrary("maps") หรือ const {InfoWindow} = await google.maps.importLibrary("streetView") ดูห้องสมุดใน Maps JavaScript API

InfoWindow
InfoWindow([opts])
พารามิเตอร์: 
สร้างหน้าต่างข้อมูลที่มีตัวเลือกที่ระบุ InfoWindow สามารถวางลงบนแผนที่ในตำแหน่งเฉพาะหรือเหนือเครื่องหมาย ทั้งนี้ขึ้นอยู่กับสิ่งที่ระบุไว้ในตัวเลือก เว้นแต่จะปิดใช้งานการแพนอัตโนมัติ InfoWindow จะเลื่อนแผนที่เพื่อแสดงตนเองเมื่อเปิดแผนที่ หลังจากสร้าง InfoWindow แล้ว คุณต้องเรียกใช้ Open เพื่อแสดงตัวเลือกนั้นบนแผนที่ ผู้ใช้สามารถคลิกปุ่มปิดบน InfoWindow เพื่อนำออกจากแผนที่ หรือนักพัฒนาซอฟต์แวร์สามารถเรียกclose() เพื่อให้ผลเช่นเดียวกัน
isOpen
ประเภท:  boolean
ตรวจสอบว่า InfoWindow เปิดอยู่หรือไม่
close
close()
พารามิเตอร์: ไม่มี
การคืนสินค้า: ไม่มี
ปิด InfoWindow นี้โดยนำออกจากโครงสร้าง DOM
focus
focus()
พารามิเตอร์: ไม่มี
การคืนสินค้า: ไม่มี
โฟกัสที่InfoWindowนี้ คุณอาจต้องพิจารณาใช้วิธีนี้ร่วมกับเหตุการณ์ visible เพื่อให้แน่ใจว่า InfoWindow จะปรากฏก่อนที่จะตั้งค่าโฟกัส ไม่สามารถโฟกัส InfoWindow ที่ไม่แสดง
getContent
getContent()
พารามิเตอร์: ไม่มี
Return Value:  string|Element|Text|null|undefined เนื้อหาของ InfoWindow นี้ ซึ่งเหมือนกับการตั้งค่าเดิมกับเนื้อหา
getHeaderContent
getHeaderContent()
พารามิเตอร์: ไม่มี
Return Value:  string|Element|Text|null|undefined เนื้อหาส่วนหัวของ InfoWindow นี้ โปรดดูInfoWindowOptions.headerContent
getHeaderDisabled
getHeaderDisabled()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  boolean|undefined ไม่ว่าจะปิดใช้แถวส่วนหัวทั้งแถวหรือไม่ โปรดดูInfoWindowOptions.headerDisabled
getPosition
getPosition()
พารามิเตอร์: ไม่มี
ผลลัพธ์:  LatLng|null|undefined ตำแหน่ง LatLng ของ InfoWindow นี้
getZIndex
getZIndex()
พารามิเตอร์: ไม่มี
ค่าการแสดงผล:  number zIndex ของ InfoWindow นี้
open
open([options, anchor])
พารามิเตอร์: 
  • optionsInfoWindowOpenOptions|Map|StreetViewPanorama optional อาจเป็นออบเจ็กต์ InfoWindowOpenOptions (แนะนำ) หรือแผนที่|พาโนรามาที่ใช้แสดงผล InfoWindow นี้
  • anchorMVCObject|AdvancedMarkerElement optional โฆษณา Anchor ที่จะวาง InfoWindow นี้ หากแท็ก Anchor ไม่เป็นค่าว่าง ระบบจะวางตำแหน่ง InfoWindow ที่กึ่งกลางด้านบนของ Anchor InfoWindow จะแสดงผลบนแผนที่หรือพาโนรามาเดียวกันกับจุดยึด (หากมี)
การคืนสินค้า: ไม่มี
เปิดหน้าต่างข้อมูลนี้บนแผนที่ที่ระบุ คุณสามารถเชื่อมโยง InfoWindow กับ Anchor ได้ ใน API หลัก แท็ก Anchor เดียวคือคลาสเครื่องหมาย แต่ Anchor อาจเป็น MVCObject ที่แสดงพร็อพเพอร์ตี้ LatLng position และพร็อพเพอร์ตี้ Point anchorPoint ก็ได้ (ไม่บังคับ) สำหรับการคำนวณ pixelOffset (ดู InfoWindowOptions) anchorPoint เป็นค่าออฟเซ็ตจากตำแหน่งของจุดยึดจนถึงส่วนปลายของ InfoWindow ขอแนะนำให้ใช้อินเทอร์เฟซ InfoWindowOpenOptions เป็นอาร์กิวเมนต์เดียวสำหรับวิธีนี้ หากไม่ต้องการให้เปลี่ยนโฟกัสของเบราว์เซอร์ขณะเปิด ให้ตั้งค่า InfoWindowOpenOptions.shouldFocus เป็น false
setContent
setContent([content])
พารามิเตอร์: 
  • contentstring|Element|Text optional เนื้อหาที่จะแสดงโดย InfoWindow นี้
การคืนสินค้า: ไม่มี
setHeaderContent
setHeaderContent([headerContent])
พารามิเตอร์: 
การคืนสินค้า: ไม่มี
setHeaderDisabled
setHeaderDisabled([headerDisabled])
พารามิเตอร์: 
  • headerDisabledboolean optional ระบุว่าจะปิดใช้แถวส่วนหัวทั้งแถวหรือไม่ โปรดดูInfoWindowOptions.headerDisabled
การคืนสินค้า: ไม่มี
setOptions
setOptions([options])
พารามิเตอร์: 
การคืนสินค้า: ไม่มี
setPosition
setPosition([position])
พารามิเตอร์: 
  • positionLatLng|LatLngLiteral optional ตำแหน่ง LatLng ที่จะแสดง InfoWindow นี้
การคืนสินค้า: ไม่มี
setZIndex
setZIndex(zIndex)
พารามิเตอร์: 
  • zIndexnumber ดัชนี z ของ InfoWindow นี้ InfoWindow ที่มีดัชนี z มากกว่าจะปรากฏหน้า InfoWindows อื่นๆ ทั้งหมดที่มีดัชนี z ต่ำกว่า
การคืนสินค้า: ไม่มี
รับค่าเดิม: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
close
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อปิด InfoWindow ตัวอย่างเช่น อาจมาจากการเรียกใช้เมธอด InfoWindow.close การกดแป้น Escape เพื่อปิด InfoWindow หรือคลิกปุ่มปิด หรือย้าย InfoWindow ไปยังแผนที่อื่น
closeclick
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อมีการคลิกปุ่มปิด
content_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อพร็อพเพอร์ตี้เนื้อหามีการเปลี่ยนแปลง
domready
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อ <div> ที่มีเนื้อหาของ InfoWindow แนบอยู่กับ DOM คุณอาจต้องตรวจสอบเหตุการณ์นี้หากคุณกำลังสร้างเนื้อหาจากหน้าต่างข้อมูลของคุณแบบไดนามิก
headercontent_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อพร็อพเพอร์ตี้ HeaderContent มีการเปลี่ยนแปลง
headerdisabled_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อพร็อพเพอร์ตี้ headerDisabled
position_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อพร็อพเพอร์ตี้ตำแหน่งมีการเปลี่ยนแปลง
visible
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อ InfoWindow ปรากฏอย่างสมบูรณ์ เหตุการณ์นี้จะไม่เริ่มทำงานเมื่อมีการเลื่อน InfoWindow ออกแล้วเลื่อนกลับมาที่หน้าจอ
zindex_changed
function()
อาร์กิวเมนต์: ไม่มี
เหตุการณ์นี้จะเริ่มทำงานเมื่อ zIndex ของ InfoWindow มีการเปลี่ยนแปลง

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

อินเทอร์เฟซของ google.maps.InfoWindowOptions

ออบเจ็กต์ InfoWindowOptions ใช้เพื่อกำหนดคุณสมบัติที่ตั้งค่าบน InfoWindow ได้

ariaLabel optional
ประเภท:  string optional
AriaLabel เพื่อกำหนดให้กับ InfoWindow
content optional
ประเภท:  string|Element|Text optional
เนื้อหาที่จะแสดงใน InfoWindow ซึ่งอาจเป็นองค์ประกอบ HTML, สตริงข้อความธรรมดา หรือสตริงที่มี HTML InfoWindow จะได้รับการปรับขนาดตามเนื้อหา หากต้องการกำหนดขนาดที่ชัดเจนสำหรับเนื้อหา ให้ตั้งค่าเนื้อหาเป็นองค์ประกอบ HTML ที่มีขนาดดังกล่าว
disableAutoPan optional
ประเภท:  boolean optional
ค่าเริ่มต้น: false
ปิดใช้การแพนแผนที่เพื่อให้ InfoWindow ปรากฏอย่างสมบูรณ์เมื่อเปิดแผนที่
headerContent optional
ประเภท:  string|Element|Text optional
เนื้อหาที่จะแสดงในแถวส่วนหัวของ InfoWindow ซึ่งอาจเป็นองค์ประกอบ HTML หรือสตริงข้อความธรรมดาก็ได้ InfoWindow จะได้รับการปรับขนาดตามเนื้อหา หากต้องการตั้งค่าขนาดที่ชัดเจนสำหรับเนื้อหาส่วนหัว ให้ตั้งค่า headerContent เป็นองค์ประกอบ HTML ที่มีขนาดดังกล่าว
headerDisabled optional
ประเภท:  boolean optional
ปิดใช้แถวส่วนหัวทั้งหมดใน InfoWindow เมื่อตั้งค่าเป็น "จริง" ระบบจะนำส่วนหัวออกเพื่อซ่อนเนื้อหาของส่วนหัวและปุ่มปิดไว้
maxWidth optional
ประเภท:  number optional
ความกว้างสูงสุดของ InfoWindow โดยไม่คำนึงถึงความกว้างของเนื้อหา โดยระบบจะพิจารณาค่านี้ก็ต่อเมื่อมีการตั้งค่าก่อนโทรหา open() เท่านั้น หากต้องการเปลี่ยนความกว้างสูงสุดเมื่อเปลี่ยนเนื้อหา ให้เรียกใช้ close(), setOptions() จากนั้นโทร open()
minWidth optional
ประเภท:  number optional
ความกว้างขั้นต่ำของ InfoWindow โดยไม่คำนึงถึงความกว้างของเนื้อหา เมื่อใช้คุณสมบัตินี้ ขอแนะนำอย่างยิ่งให้ตั้งค่า minWidth เป็นค่าที่น้อยกว่าความกว้างของแผนที่ (เป็นพิกเซล) โดยระบบจะพิจารณาค่านี้ก็ต่อเมื่อมีการตั้งค่าก่อนโทรหา open() เท่านั้น หากต้องการเปลี่ยนความกว้างขั้นต่ำเมื่อเปลี่ยนเนื้อหา ให้เรียกใช้ close(), setOptions() จากนั้นโทร open()
pixelOffset optional
ประเภท:  Size optional
ระยะห่างเป็นพิกเซลของส่วนปลายของหน้าต่างข้อมูลจากจุดบนแผนที่ที่พิกัดทางภูมิศาสตร์ซึ่งตรึงกับหน้าต่างข้อมูลอยู่ หาก InfoWindow เปิดด้วย Anchor ระบบจะคำนวณ pixelOffset จากพร็อพเพอร์ตี้ anchorPoint ของ Anchor
position optional
ประเภท:  LatLng|LatLngLiteral optional
LatLng เพื่อแสดง InfoWindow นี้ หาก InfoWindow เปิดด้วย Anchor ระบบจะใช้ตำแหน่งของจุดยึดแทน
zIndex optional
ประเภท:  number optional
InfoWindows ทั้งหมดแสดงบนแผนที่ตามลำดับ zIndex โดยแสดงค่าที่สูงกว่าอยู่หน้า InfoWindows ที่มีค่าต่ำกว่า โดยค่าเริ่มต้น InfoWindows จะแสดงตามละติจูด พร้อมด้วย InfoWindows ที่แสดงละติจูดที่ต่ำกว่าจะปรากฏหน้า InfoWindows ในละติจูดที่สูงกว่า InfoWindows จะแสดงอยู่หน้าเครื่องหมายเสมอ

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

อินเทอร์เฟซของ google.maps.InfoWindowOpenOptions

ตัวเลือกสำหรับการเปิด InfoWindow

anchor optional
ประเภท:  MVCObject|AdvancedMarkerElement optional
Anchor ที่จะมีตำแหน่ง InfoWindow นี้ หากแท็ก Anchor ไม่เป็นค่าว่าง ระบบจะวางตำแหน่ง InfoWindow ที่กึ่งกลางด้านบนของ Anchor InfoWindow จะแสดงผลบนแผนที่หรือพาโนรามาเดียวกันกับจุดยึด (หากมี)
map optional
ประเภท:  Map|StreetViewPanorama optional
แผนที่หรือพาโนรามาที่จะแสดง InfoWindow นี้
shouldFocus optional
ประเภท:  boolean optional
ควรย้ายโฟกัสภายใน InfoWindow หรือไม่เมื่อเปิด เมื่อไม่ได้ตั้งค่าพร็อพเพอร์ตี้นี้หรือเมื่อตั้งค่าเป็น null หรือ undefined ระบบจะใช้การเรียนรู้เพื่อตัดสินใจว่าจะย้ายโฟกัสหรือไม่ ขอแนะนำให้ตั้งค่าพร็อพเพอร์ตี้นี้อย่างชัดเจนเพื่อให้เหมาะกับความต้องการของคุณเนื่องจากการเรียนรู้อาจมีการเปลี่ยนแปลงและทำงานได้ไม่ดีกับกรณีใช้งานทั้งหมด