Info Window

InfoWindow

Lớp google.maps.InfoWindow

Lớp phủ trông giống như bong bóng và thường được kết nối với điểm đánh dấu.

Lớp này mở rộng MVCObject.

Truy cập bằng cách gọi const {InfoWindow} = await google.maps.importLibrary("maps") hoặc const {InfoWindow} = await google.maps.importLibrary("streetView"). Xem Thư viện trong API JavaScript của Maps.
InfoWindow
InfoWindow([opts])
Thông số: 
Tạo một cửa sổ thông tin với các tuỳ chọn cho sẵn. Có thể đặt InfoWindow trên bản đồ ở vị trí cụ thể hoặc phía trên điểm đánh dấu, tùy thuộc vào những gì được chỉ định trong tùy chọn. Trừ khi chức năng tự động xoay bị vô hiệu hóa, InfoWindow sẽ xoay bản đồ để hiển thị chính nó khi nó được mở. Sau khi tạo một InfoWindow, bạn phải gọi mở để hiển thị thông tin này trên bản đồ. Người dùng có thể nhấp vào nút đóng trên InfoWindow để xóa nó khỏi bản đồ hoặc nhà phát triển có thể gọi close() để có cùng hiệu ứng.
close
close()
Thông số: Không có
Giá trị trả lại: Không có
Đóng InfoWindow này bằng cách xoá khỏi cấu trúc DOM.
focus
focus()
Thông số: Không có
Giá trị trả lại: Không có
Đặt trọng tâm vào InfoWindow này. Bạn nên cân nhắc sử dụng phương thức này cùng với sự kiện visible để đảm bảo rằng InfoWindow hiển thị trước khi đặt tiêu điểm vào sự kiện đó. Không thể lấy tiêu điểm cho một InfoWindow không hiển thị.
getContent
getContent()
Thông số: Không có
Giá trị trả về:  string|Element|Text|null|undefined Nội dung của InfoWindow này. Giống như những gì đã được đặt trước đó làm nội dung.
getPosition
getPosition()
Thông số: Không có
Giá trị trả về:  LatLng|null|undefined Vị trí LatLng của InfoWindow này.
getZIndex
getZIndex()
Thông số: Không có
Giá trị trả về:  number Chỉ mục zIndex của InfoWindow này.
open
open([options, anchor])
Thông số: 
  • options:  InfoWindowOpenOptions|Map|StreetViewPanorama optional Đối tượng InfoWindowOpenOptions (được đề xuất) hoặc bản đồ|panorama trên đó hiển thị InfoWindow này.
  • anchor:  MVCObject|AdvancedMarkerElement optional Neo mà InfoWindow này sẽ được định vị. Nếu neo không rỗng, InfoWindow sẽ được đặt ở chính giữa trên cùng của neo. InfoWindow sẽ được hiển thị trên cùng một bản đồ hoặc toàn cảnh như liên kết (nếu có).
Giá trị trả lại: Không có
Mở InfoWindow này trên bản đồ đã cung cấp. Tùy chọn, một InfoWindow có thể được liên kết với một điểm neo. Trong API cốt lõi, điểm neo duy nhất là lớp Marker. Tuy nhiên, một văn bản liên kết có thể là bất kỳ MVCObject nào để lộ thuộc tính LatLng position và có thể là thuộc tính Point anchorPoint để tính pixelOffset (xem InfoWindowOptions). anchorPoint là độ lệch từ vị trí của điểm neo đến điểm của InfoWindow. Bạn nên sử dụng giao diện InfoWindowOpenOptions làm đối số duy nhất cho phương thức này. Để ngăn việc thay đổi tiêu điểm của trình duyệt khi mở, hãy đặt InfoWindowOpenOptions.shouldFocus thành false.
setContent
setContent([content])
Thông số: 
  • content:  string|Element|Text optional Nội dung được hiển thị trong InfoWindow này.
Giá trị trả lại: Không có
setOptions
setOptions([options])
Thông số: 
Giá trị trả lại: Không có
setPosition
setPosition([position])
Thông số: 
  • position:  LatLng|LatLngLiteral optional Vị trí LatLng để hiển thị InfoWindow này.
Giá trị trả lại: Không có
setZIndex
setZIndex(zIndex)
Thông số: 
  • zIndex:  number Chỉ mục z cho InfoWindow này. Một InfoWindow có chỉ mục z lớn hơn sẽ được hiển thị trước tất cả các InfoWindows khác có chỉ mục z thấp hơn.
Giá trị trả lại: Không có
Kế thừa: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll
closeclick
function()
Đối số: Không có
Sự kiện này được kích hoạt khi người dùng nhấp vào nút đóng.
content_changed
function()
Đối số: Không có
Sự kiện này được kích hoạt khi thuộc tính nội dung thay đổi.
domready
function()
Đối số: Không có
Sự kiện này được kích hoạt khi <div> chứa nội dung của InfoWindow được đính kèm vào DOM. Bạn có thể muốn theo dõi sự kiện này nếu bạn đang xây dựng nội dung cửa sổ thông tin động.
position_changed
function()
Đối số: Không có
Sự kiện này được kích hoạt khi thuộc tính vị trí thay đổi.
visible
function()
Đối số: Không có
Sự kiện này được kích hoạt khi InfoWindow hiển thị hoàn toàn. Sự kiện này không được kích hoạt khi InfoWindow tắt và sau đó quay lại màn hình.
zindex_changed
function()
Đối số: Không có
Sự kiện này được kích hoạt khi zIndex của InfoWindow thay đổi.

InfoWindowOptions

Giao diện google.maps.InfoWindowOptions

Đối tượng InfoWindowOptions dùng để xác định các thuộc tính có thể đặt trên InfoWindow.
ariaLabel optional
Loại:  string optional
AriaLabel sẽ gán cho InfoWindow.
content optional
Loại:  string|Element|Text optional
Nội dung để hiển thị trong InfoWindow. Đó có thể là một phần tử HTML, một chuỗi văn bản thuần túy hoặc một chuỗi chứa HTML. InfoWindow sẽ được định kích thước theo nội dung. Để đặt kích thước rõ ràng cho nội dung, hãy đặt nội dung là phần tử HTML có kích thước đó.
disableAutoPan optional
Loại:  boolean optional
Mặc định: false
Tắt xoay bản đồ để làm cho InfoWindow hiển thị đầy đủ khi cửa sổ mở ra.
maxWidth optional
Loại:  number optional
Chiều rộng tối đa của InfoWindow, bất kể chiều rộng của nội dung. Giá trị này chỉ được xem xét nếu được đặt trước khi gọi open(). Để thay đổi chiều rộng tối đa khi thay đổi nội dung, hãy gọi close(), setOptions(), sau đó gọi open().
minWidth optional
Loại:  number optional
Chiều rộng tối thiểu của InfoWindow, bất kể chiều rộng của nội dung. Khi sử dụng thuộc tính này, bạn nên đặt minWidth thành một giá trị nhỏ hơn chiều rộng của bản đồ (tính bằng pixel). Giá trị này chỉ được xem xét nếu được đặt trước khi gọi open(). Để thay đổi chiều rộng tối thiểu khi thay đổi nội dung, hãy gọi close(), setOptions(), sau đó gọi open().
pixelOffset optional
Loại:  Size optional
Phần bù, tính bằng pixel, của đầu cửa sổ thông tin từ điểm trên bản đồ có tọa độ địa lý mà cửa sổ thông tin được cố định. Nếu bạn mở một InfoWindow bằng một ký tự liên kết, thì pixelOffset sẽ được tính từ thuộc tính anchorPoint của liên kết đó.
position optional
Loại:  LatLng|LatLngLiteral optional
LatLng để hiển thị InfoWindow này. Nếu InfoWindow được mở bằng neo, vị trí của neo sẽ được sử dụng thay thế.
zIndex optional
Loại:  number optional
Tất cả InfoWindows được hiển thị trên bản đồ theo thứ tự zIndex, với các giá trị cao hơn hiển thị trước InfoWindows với các giá trị thấp hơn. Theo mặc định, InfoWindows được hiển thị theo vĩ độ, với InfoWindows có vĩ độ thấp hơn xuất hiện phía trước InfoWindows ở vĩ độ cao hơn. InfoWindows luôn được hiển thị trước các điểm đánh dấu.

Giao diện InfoWindowOpenOptions

Giao diện google.maps.InfoWindowOpenOptions

Các tuỳ chọn để mở InfoWindow
anchor optional
Loại:  MVCObject|AdvancedMarkerElement optional
Neo mà InfoWindow này sẽ được định vị. Nếu neo không rỗng, InfoWindow sẽ được đặt ở chính giữa trên cùng của neo. InfoWindow sẽ được hiển thị trên cùng một bản đồ hoặc toàn cảnh như liên kết (nếu có).
map optional
Loại:  Map|StreetViewPanorama optional
Bản đồ hoặc ảnh toàn cảnh để hiển thị InfoWindow này.
shouldFocus optional
Loại:  boolean optional
Liệu tiêu điểm có nên được di chuyển vào bên trong InfoWindow khi nó được mở hay không. Khi bạn không đặt thuộc tính này hoặc đặt thành null hoặc undefined, một phương pháp phỏng đoán sẽ được dùng để quyết định xem có nên di chuyển tiêu điểm hay không. Bạn nên đặt thuộc tính này một cách rõ ràng cho phù hợp với nhu cầu của mình vì kỹ thuật phỏng đoán có thể thay đổi và có thể không hoạt động tốt cho tất cả các trường hợp sử dụng.