Advanced Markers

AdvancedMarkerElement คลาส

google.maps.marker.AdvancedMarkerElement ชั้น

แสดงตําแหน่งบนแผนที่ โปรดทราบว่าต้องตั้งค่า position ให้แสดง AdvancedMarkerElement

หมายเหตุ: การใช้งานเป็นคอมโพเนนต์ของเว็บ (เช่น การใช้องค์ประกอบ HTML ที่กําหนดเองของ <gmp-advanced-marker> จะพร้อมใช้งานในช่อง v=beta เท่านั้น)

องค์ประกอบที่กําหนดเอง:
<gmp-advanced-marker position="lat,lng" title="string"></gmp-advanced-marker>

คลาสนี้จะขยาย HTMLElement

คลาสนี้ใช้ AdvancedMarkerElementOptions

เข้าถึงโดยโทรไปที่ const {AdvancedMarkerElement} = await google.maps.importLibrary("marker") ดูห้องสมุดใน Maps JavaScript API

ผู้ผลิต
AdvancedMarkerElement	AdvancedMarkerElement([options]) พารามิเตอร์:  options:  AdvancedMarkerElementOptions optional สร้าง AdvancedMarkerElement ด้วยตัวเลือกที่ระบุ หากระบุแผนที่แล้ว ระบบจะเพิ่ม AdvancedMarkerElement ลงในแผนที่เมื่อสร้าง

พร็อพเพอร์ตี้
collisionBehavior	ประเภท:  CollisionBehavior optional ดูAdvancedMarkerElementOptions.collisionBehavior
content	ประเภท:  Node optional ดูAdvancedMarkerElementOptions.content
element	ประเภท:  HTMLElement ช่องนี้เป็นแบบอ่านอย่างเดียว องค์ประกอบ DOM สนับสนุนมุมมอง
gmpDraggable	ประเภท:  boolean optional ดูAdvancedMarkerElementOptions.gmpDraggable
map	ประเภท:  Map optional ดูAdvancedMarkerElementOptions.map
position	ประเภท:  LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional ดูAdvancedMarkerElementOptions.position แอตทริบิวต์ HTML: <gmp-advanced-marker position="lat,lng"></gmp-advanced-marker> <gmp-advanced-marker position="lat,lng,altitude"></gmp-advanced-marker>
title	ประเภท:  string ดูAdvancedMarkerElementOptions.title แอตทริบิวต์ HTML: <gmp-advanced-marker title="string"></gmp-advanced-marker>
zIndex	ประเภท:  number optional ดูAdvancedMarkerElementOptions.zIndex

วิธีการ
addEventListener	หมายเหตุ: ใช้ได้เฉพาะในเวอร์ชัน v=เบต้า เท่านั้น addEventListener(type, listener[, options]) พารามิเตอร์:  type:  string สตริงที่พิจารณาตัวพิมพ์เล็กและตัวพิมพ์ใหญ่แสดงถึงประเภทเหตุการณ์ที่จะฟัง listener:  EventListener|EventListenerObject วัตถุที่ได้รับการแจ้งเตือน ต้องเป็นฟังก์ชันหรือออบเจ็กต์ที่มีเมธอดแฮนเดิลEvent options:  boolean|AddEventListenerOptions optional ดูตัวเลือก เหตุการณ์ที่กําหนดเองรองรับเฉพาะ capture และ passive ค่าที่ส่งกลับ:  void ตั้งค่าฟังก์ชันที่จะเรียกใช้เมื่อใดก็ตามที่มีการส่งเหตุการณ์ที่ระบุไปยังเป้าหมาย ดู addEventListener
addListener	addListener(eventName, handler) พารามิเตอร์:  eventName:  string เหตุการณ์ที่สังเกตได้ handler:  Function ฟังก์ชันสําหรับจัดการเหตุการณ์ Return Value:  MapsEventListener Listener เหตุการณ์ที่แสดงผลลัพธ์ เพิ่มฟังก์ชัน Listener ที่กําหนดลงในชื่อเหตุการณ์ที่กําหนดในระบบเหตุการณ์เหตุการณ์แผนที่
removeEventListener	หมายเหตุ: ใช้ได้เฉพาะในเวอร์ชัน v=เบต้า เท่านั้น removeEventListener(type, listener[, options]) พารามิเตอร์:  type:  string สตริงที่ระบุประเภทเหตุการณ์ที่จะนํา Listener เหตุการณ์ออก listener:  EventListener|EventListenerObject Listener เหตุการณ์ของเครื่องจัดการเหตุการณ์ที่จะนําออกจากเป้าหมายเหตุการณ์ options:  boolean|EventListenerOptions optional ดูตัวเลือก ค่าที่ส่งกลับ:  void นํา Listener เหตุการณ์ที่ลงทะเบียนไว้กับ addEventListener ออกจากเป้าหมายก่อนหน้านี้ โปรดดู removeEventListener

กิจกรรม
click	function(event) อาร์กิวเมนต์:  event:  MapMouseEvent เหตุการณ์นี้จะเกิดขึ้นเมื่อมีการคลิกองค์ประกอบ AdvancedMarkerElement ไม่สามารถใช้ได้กับ addEventListener() (ใช้ gmp-click แทน)
drag	function(event) อาร์กิวเมนต์:  event:  MapMouseEvent เหตุการณ์นี้จะเกิดขึ้นซ้ําๆ ขณะที่ผู้ใช้ลาก AdvancedMarkerElement ไม่สามารถใช้ได้กับ addEventListener()
dragend	function(event) อาร์กิวเมนต์:  event:  MapMouseEvent เหตุการณ์นี้จะเกิดขึ้นเมื่อผู้ใช้หยุดลาก AdvancedMarkerElement ไม่สามารถใช้ได้กับ addEventListener()
dragstart	function(event) อาร์กิวเมนต์:  event:  MapMouseEvent เหตุการณ์นี้จะเริ่มทํางานเมื่อผู้ใช้เริ่มลาก AdvancedMarkerElement ไม่สามารถใช้ได้กับ addEventListener()
gmp-click	หมายเหตุ: ใช้ได้เฉพาะในเวอร์ชัน v=เบต้า เท่านั้น function(event) อาร์กิวเมนต์:  event:  AdvancedMarkerClickEvent เหตุการณ์นี้จะเกิดขึ้นเมื่อมีการคลิกองค์ประกอบ AdvancedMarkerElement ใช้ได้ดีที่สุดกับ addEventListener() (แทน addListener())

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

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

ตัวเลือกสําหรับการสร้าง AdvancedMarkerElement

พร็อพเพอร์ตี้
collisionBehavior optional	ประเภท:  CollisionBehavior optional การแจงนับที่ระบุว่า AdvancedMarkerElement ควรทํางานอย่างไรเมื่อนํารถไปชนกับ AdvancedMarkerElement อื่น หรือติดป้ายฐานบนแผนที่เวกเตอร์ หมายเหตุ: การปะทะของ AdvancedMarkerElement กับ AdvancedMarkerElement ทํางานได้ทั้งกับแผนที่แรสเตอร์และเวกเตอร์ แต่ AdvancedMarkerElement การปะทะของป้ายกํากับแผนที่ฐานจะทํางานเฉพาะบนแผนที่เวกเตอร์
content optional	ประเภท:  Node optional ค่าเริ่มต้น: PinElement.element องค์ประกอบ DOM สนับสนุนภาพของ AdvancedMarkerElement หมายเหตุ: AdvancedMarkerElement ไม่ได้จําลององค์ประกอบ DOM ที่ผ่านแล้ว เมื่อย้ายองค์ประกอบ DOM ไปยัง AdvancedMarkerElement แล้ว การส่งองค์ประกอบ DOM เดียวกันไปยัง AdvancedMarkerElement อื่นจะย้ายองค์ประกอบ DOM และทําให้ AdvancedMarkerElement ก่อนหน้านี้ดูเหมือนว่างเปล่า
gmpDraggable optional	ประเภท:  boolean optional ค่าเริ่มต้น: false หาก true สามารถลาก AdvancedMarkerElement ได้ หมายเหตุ: AdvancedMarkerElement ที่มีระดับความสูงไม่สามารถลากได้
map optional	ประเภท:  Map optional แผนที่ที่จะแสดง AdvancedMarkerElement แผนที่จําเป็นต้องแสดง AdvancedMarkerElement และให้บริการโดยการตั้งค่า AdvancedMarkerElement.map หากไม่ได้ระบุไว้ในการก่อสร้าง
position optional	ประเภท:  LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional ตั้งค่าตําแหน่งของ AdvancedMarkerElement AdvancedMarkerElement อาจสร้างขึ้นโดยไม่มีตําแหน่ง แต่จะไม่แสดงจนกว่าจะระบุตําแหน่งได้ เช่น จากการดําเนินการหรือตัวเลือกของผู้ใช้ ตําแหน่งของ AdvancedMarkerElement ได้มาจากการตั้งค่า AdvancedMarkerElement.position หากไม่ได้ระบุไว้ในการก่อสร้าง หมายเหตุ: AdvancedMarkerElement ที่มีระดับความสูงจะได้รับการสนับสนุนบนแผนที่เวกเตอร์เท่านั้น
title optional	ประเภท:  string optional วางเมาส์เหนือข้อความ ข้อความเกี่ยวกับการช่วยเหลือพิเศษ (เช่น สําหรับใช้กับโปรแกรมอ่านหน้าจอ) ใน AdvancedMarkerElement จะถูกระบุไว้พร้อมค่าที่ระบุ
zIndex optional	ประเภท:  number optional AdvancedMarkerElement ทั้งหมดจะแสดงบนแผนที่ตามค่า zIndex โดยมีค่าที่สูงขึ้นแสดงข้างหน้า AdvancedMarkerElement ที่มีค่าต่ํากว่า โดยค่าเริ่มต้น AdvancedMarkerElement จะแสดงตามตําแหน่งแนวตั้งบนหน้าจอ โดยมี AdvancedMarkerElement ต่ํากว่าปรากฏที่ด้านหน้าของหน้าจอ AdvancedMarkerElement โปรดทราบว่า zIndex ยังใช้ในการกําหนดลําดับความสําคัญสัมพัทธ์ระหว่าง CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY เครื่องหมายขั้นสูง ค่า zIndex ที่สูงขึ้นหมายถึงลําดับความสําคัญสูงกว่า

AdvancedMarkerClickEvent คลาส

google.maps.marker.AdvancedMarkerClickEvent ชั้น

หมายเหตุ: ใช้ได้เฉพาะในเวอร์ชัน v=เบต้า เท่านั้น

กิจกรรมนี้สร้างขึ้นจากการคลิกเครื่องหมายขั้นสูง เข้าถึงตําแหน่งของเครื่องหมายevent.target.position

คลาสนี้จะขยาย Event

เข้าถึงโดยโทรไปที่ const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker") ดูห้องสมุดใน Maps JavaScript API

PinElement คลาส

google.maps.marker.PinElement ชั้น

PinElement แสดงถึงองค์ประกอบ DOM ที่ประกอบด้วยรูปร่างและอักขระ รูปทรงมีรูปแบบบอลลูนแบบเดียวกับที่เห็นใน AdvancedMarkerElement เริ่มต้น รูปอักขระเป็นองค์ประกอบ DOM ที่ไม่บังคับซึ่งจะแสดงเป็นรูปบอลลูน PinElement อาจมีอัตราส่วนที่แตกต่างกันโดยขึ้นอยู่กับ PinElement.scale

หมายเหตุ: ยังไม่รองรับการใช้งานเป็นคอมโพเนนต์ของเว็บ (เช่น การใช้งานเป็นคลาสย่อย HTMLElement หรือผ่าน HTML)

คลาสนี้จะขยาย HTMLElement

คลาสนี้ใช้ PinElementOptions

เข้าถึงโดยโทรไปที่ const {PinElement} = await google.maps.importLibrary("marker") ดูห้องสมุดใน Maps JavaScript API

ผู้ผลิต
PinElement	PinElement([options]) พารามิเตอร์:  options:  PinElementOptions optional

พร็อพเพอร์ตี้
background	ประเภท:  string optional ดูPinElementOptions.background
borderColor	ประเภท:  string optional ดูPinElementOptions.borderColor
element	ประเภท:  HTMLElement ช่องนี้เป็นแบบอ่านอย่างเดียว องค์ประกอบ DOM สนับสนุนมุมมอง
glyph	ประเภท:  string|Element|URL optional ดูPinElementOptions.glyph
glyphColor	ประเภท:  string optional ดูPinElementOptions.glyphColor
scale	ประเภท:  number optional ดูPinElementOptions.scale

วิธีการ
addEventListener	หมายเหตุ: ใช้ได้เฉพาะในเวอร์ชัน v=เบต้า เท่านั้น addEventListener(type, listener[, options]) พารามิเตอร์:  type:  string listener:  EventListener|EventListenerObject options:  boolean|AddEventListenerOptions optional ค่าที่ส่งกลับ:  void ฟังก์ชันนี้ยังไม่พร้อมใช้งาน
removeEventListener	หมายเหตุ: ใช้ได้เฉพาะในเวอร์ชัน v=เบต้า เท่านั้น removeEventListener(type, listener[, options]) พารามิเตอร์:  type:  string สตริงที่ระบุประเภทเหตุการณ์ที่จะนํา Listener เหตุการณ์ออก listener:  EventListener|EventListenerObject Listener เหตุการณ์ของเครื่องจัดการเหตุการณ์ที่จะนําออกจากเป้าหมายเหตุการณ์ options:  boolean|EventListenerOptions optional ดูตัวเลือก ค่าที่ส่งกลับ:  void นํา Listener เหตุการณ์ที่ลงทะเบียนไว้กับ addEventListener ออกจากเป้าหมายก่อนหน้านี้ โปรดดู removeEventListener

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

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

ตัวเลือกสําหรับการสร้าง PinElement

พร็อพเพอร์ตี้
background optional	ประเภท:  string optional สีพื้นหลังของรูปร่างหมุด รองรับค่าสี CSS
borderColor optional	ประเภท:  string optional สีเส้นขอบของรูปร่างหมุด รองรับค่าสี CSS
glyph optional	ประเภท:  string|Element|URL optional องค์ประกอบ DOM ที่แสดงใน PIN
glyphColor optional	ประเภท:  string optional สีของรูปอักขระ รองรับค่าสี CSS
scale optional	ประเภท:  number optional ค่าเริ่มต้น: 1 ขนาดของหมุด