DOM elements

Lớp OverlayView

google.maps.OverlayView class
extends MVCObject
library "maps", "streetView"

Bạn có thể triển khai lớp này nếu muốn hiển thị các loại đối tượng lớp phủ tuỳ chỉnh trên bản đồ.

Kế thừa từ lớp này bằng cách đặt nguyên mẫu của lớp phủ: MyOverlay.prototype = new google.maps.OverlayView();. Hàm khởi tạo OverlayView được đảm bảo là một hàm trống.

Bạn phải triển khai 3 phương thức: onAdd(), draw() và onRemove().

  • Trong phương thức onAdd(), bạn nên tạo các đối tượng DOM và thêm các đối tượng đó làm phần tử con của ngăn.
  • Trong phương thức draw(), bạn nên định vị các phần tử này.
  • Trong phương thức onRemove(), bạn nên xoá các đối tượng khỏi DOM.
Bạn phải gọi setMap() bằng một đối tượng Map hợp lệ để kích hoạt lệnh gọi đến phương thức onAdd() và setMap(null) để kích hoạt phương thức onRemove(). Bạn có thể gọi phương thức setMap() tại thời điểm tạo hoặc bất cứ lúc nào sau đó khi cần hiển thị lại lớp phủ sau khi xoá. Sau đó, phương thức draw() sẽ được gọi bất cứ khi nào một thuộc tính bản đồ thay đổi có thể làm thay đổi vị trí của phần tử, chẳng hạn như mức thu phóng, tâm hoặc loại bản đồ.

const {OverlayView} = await google.maps.importLibrary("maps");
hoặc
const {OverlayView} = await google.maps.importLibrary("streetView");
OverlayView
OverlayView()
Tham số: Không có
Tạo OverlayView.
preventMapHitsAndGesturesFrom
preventMapHitsAndGesturesFrom(element)
Tham số:
Giá trị trả về: Không có
Ngăn các sự kiện nhấp, nhấn, kéo và cuộn trên phần tử nổi lên bản đồ. Sử dụng thuộc tính này để ngăn việc kéo và thu phóng bản đồ, cũng như các sự kiện "nhấp" vào bản đồ.
preventMapHitsFrom
preventMapHitsFrom(element)
Tham số:
Giá trị trả về: Không có
Ngăn chặn hành động nhấp hoặc nhấn vào phần tử nổi lên trên bản đồ. Sử dụng thuộc tính này để ngăn bản đồ kích hoạt sự kiện "nhấp".
draw
draw()
Tham số: Không có
Giá trị trả về: void
Hãy triển khai phương thức này để vẽ hoặc cập nhật lớp phủ. Sử dụng vị trí từ projection.fromLatLngToDivPixel() để đặt lớp phủ đúng vị trí so với MapPanes. Phương thức này được gọi sau onAdd() và được gọi khi thay đổi mức thu phóng hoặc tâm. Bạn không nên thực hiện công việc tốn kém về mặt tính toán trong phương thức này.
getMap
getMap()
Tham số: Không có
Giá trị trả về: Map|StreetViewPanorama
getPanes
getPanes()
Tham số: Không có
Giá trị trả về: MapPanes|null
Trả về các ngăn mà OverlayView này có thể hiển thị. Các ngăn sẽ không được khởi chạy cho đến khi API gọi onAdd.
getProjection
getProjection()
Tham số: Không có
Giá trị trả về: MapCanvasProjection
Trả về đối tượng MapCanvasProjection liên kết với OverlayView này. Phép chiếu không được khởi tạo cho đến khi onAdd được API gọi.
onAdd
onAdd()
Tham số: Không có
Giá trị trả về: void
Triển khai phương thức này để khởi chạy các phần tử DOM lớp phủ. Phương thức này được gọi một lần sau khi setMap() được gọi bằng một bản đồ hợp lệ. Tại thời điểm này, các ngăn và phép chiếu sẽ được khởi tạo.
onRemove
onRemove()
Tham số: Không có
Giá trị trả về: void
Triển khai phương thức này để xoá các phần tử khỏi DOM. Phương thức này được gọi một lần sau khi gọi setMap(null).
setMap
setMap(map)
Tham số:
  • map: Map|StreetViewPanorama optional Bản đồ hoặc ảnh toàn cảnh. Nếu null, lớp sẽ bị xoá.
Giá trị trả về: Không có
Thêm lớp phủ vào bản đồ hoặc ảnh toàn cảnh.
Được kế thừa: addListener, bindTo, get, notify, set, setValues, unbind, unbindAll

Giao diện MapPanes

google.maps.MapPanes giao diện

floatPane
Loại: Element
Ngăn này chứa cửa sổ thông tin. Lớp này nằm trên tất cả các lớp phủ bản đồ. (Ngăn 4).
mapPane
Loại: Element
Ngăn này là ngăn thấp nhất và nằm phía trên các ô. Nó không nhận được sự kiện DOM. (Ngăn 0).
markerLayer
Loại: Element
Ngăn này chứa các điểm đánh dấu. Nó không nhận được sự kiện DOM. (Ngăn 2).
overlayLayer
Loại: Element
Ngăn này chứa các hình nhiều đường, đa giác, lớp phủ mặt đất và lớp phủ lớp thông tin bản đồ. Nó không nhận được sự kiện DOM. (Ngăn 1).
overlayMouseTarget
Loại: Element
Ngăn này chứa các phần tử nhận sự kiện DOM. (Ngăn 3).

Giao diện MapCanvasProjection

google.maps.MapCanvasProjection giao diện

Đối tượng này được cung cấp cho OverlayView từ trong phương thức vẽ. Không có gì được đảm bảo rằng đối tượng này sẽ được khởi động cho đến khi lệnh vẽ được gọi.

fromContainerPixelToLatLng
fromContainerPixelToLatLng(pixel[, noClampNoWrap])
Tham số:
  • pixel: Point optional
  • noClampNoWrap: boolean optional
Giá trị trả về: LatLng|null
Tính toán toạ độ địa lý từ toạ độ pixel trong vùng chứa của bản đồ.
fromDivPixelToLatLng
fromDivPixelToLatLng(pixel[, noClampNoWrap])
Tham số:
  • pixel: Point optional
  • noClampNoWrap: boolean optional
Giá trị trả về: LatLng|null
Tính toán toạ độ địa lý từ toạ độ pixel trong div chứa bản đồ có thể kéo.
fromLatLngToContainerPixel
fromLatLngToContainerPixel(latLng)
Tham số:
Giá trị trả về: Point|null
Tính toán toạ độ pixel của vị trí địa lý đã cho trong phần tử vùng chứa của bản đồ.
fromLatLngToDivPixel
fromLatLngToDivPixel(latLng)
Tham số:
Giá trị trả về: Point|null
Tính toán toạ độ pixel của vị trí địa lý đã cho trong phần tử DOM chứa bản đồ có thể kéo.
getVisibleRegion
getVisibleRegion()
Tham số: Không có
Giá trị trả về: VisibleRegion|null
Khu vực hiển thị của bản đồ. Trả về null nếu bản đồ không có kích thước. Trả về null nếu OverlayView nằm trên StreetViewPanorama.
getWorldWidth
getWorldWidth()
Tham số: Không có
Giá trị trả về: number
Chiều rộng của thế giới tính bằng pixel ở mức thu phóng hiện tại. Đối với các phép chiếu có góc hướng là 90 hoặc 270 độ, giá trị này tương ứng với khoảng pixel trong trục Y.