3D Maps

Lớp Map3DElement

Lớp google.maps.maps3d.Map3DElement

Map3DElement là một giao diện HTML cho chế độ xem Bản đồ 3D.

Phần tử tuỳ chỉnh:
<gmp-map-3d center="lat,lng,altitude" default-labels-disabled default-ui-disabled heading="number" max-altitude="number" max-heading="number" max-tilt="number" min-altitude="number" min-heading="number" min-tilt="number" range="number" roll="number" tilt="number"></gmp-map-3d>

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

Lớp này triển khai Map3DElementOptions.

Truy cập bằng cách gọi const {Map3DElement} = await google.maps.importLibrary("maps3d").
Xem Thư viện trong Maps JavaScript API.

Map3DElement
Map3DElement([options])
Tham số: 
bounds
Khi được đặt, tham số này sẽ hạn chế vị trí của camera trong phạm vi vĩ độ/kinh độ đã chỉ định. Xin lưu ý rằng các đối tượng bên ngoài ranh giới vẫn được kết xuất. Ranh giới có thể hạn chế cả kinh độ và vĩ độ, hoặc chỉ hạn chế vĩ độ hoặc kinh độ. Đối với ranh giới chỉ có vĩ độ, hãy sử dụng kinh độ phía tây và phía đông của -180180, tương ứng. Đối với ranh giới chỉ có kinh độ, hãy sử dụng vĩ độ bắc và vĩ độ nam lần lượt là 90-90.
center
Tâm của bản đồ được cho dưới dạng LatLngAltitude, trong đó độ cao tính bằng mét so với mực nước biển. Xin lưu ý rằng đây không nhất thiết là vị trí của camera, vì trường range ảnh hưởng đến khoảng cách của camera so với tâm bản đồ. Nếu không được thiết lập, giá trị mặc định sẽ là {lat: 0, lng: 0, altitude: 63170000}. 63.170.000 mét là độ cao tối đa được phép (bán kính Trái Đất nhân với 10).
Thuộc tính HTML:
  • <gmp-map-3d center="lat,lng,altitude"></gmp-map-3d>
defaultLabelsDisabled
Loại:  boolean optional
Mặc định: false
Khi true, nhãn mặc định trên bản đồ sẽ không được hiển thị.
Thuộc tính HTML:
  • <gmp-map-3d default-labels-disabled></gmp-map-3d>
defaultUIDisabled
Loại:  boolean optional
Mặc định: false
Khi true, tất cả các nút mặc định trên giao diện người dùng đều bị vô hiệu hoá. Không tắt các chế độ điều khiển bằng cử chỉ và bàn phím.
Thuộc tính HTML:
  • <gmp-map-3d default-ui-disabled></gmp-map-3d>
heading
Loại:  number optional
Hướng la bàn của bản đồ, tính bằng độ, trong đó hướng bắc là 0. Khi không có độ nghiêng, mọi độ xoay sẽ được hiểu là hướng.
Thuộc tính HTML:
  • <gmp-map-3d heading="number"></gmp-map-3d>
maxAltitude
Loại:  number optional
Độ cao tối đa so với mặt đất sẽ xuất hiện trên bản đồ. Giá trị hợp lệ nằm trong khoảng từ 0 đến 63170000 mét (bán kính Trái Đất nhân với 10).
Thuộc tính HTML:
  • <gmp-map-3d max-altitude="number"></gmp-map-3d>
maxHeading
Loại:  number optional
Góc phương vị (xoay) tối đa của bản đồ. Giá trị hợp lệ nằm trong khoảng từ 0 đến 360 độ. minHeadingmaxHeading biểu thị một khoảng thời gian <= 360 độ mà cử chỉ xoay đầu sẽ được cho phép. minHeading = 180maxHeading = 90 sẽ cho phép hướng đi ở [0, 90] và hướng đi ở [180, 360]. minHeading = 90maxHeading = 180 sẽ cho phép hướng đầu trong [90, 180].
Thuộc tính HTML:
  • <gmp-map-3d max-heading="number"></gmp-map-3d>
maxTilt
Loại:  number optional
Góc tới tối đa của bản đồ. Giá trị hợp lệ nằm trong khoảng từ 0 đến 90 độ.
Thuộc tính HTML:
  • <gmp-map-3d max-tilt="number"></gmp-map-3d>
minAltitude
Loại:  number optional
Độ cao tối thiểu so với mặt đất sẽ xuất hiện trên bản đồ. Giá trị hợp lệ nằm trong khoảng từ 0 đến 63170000 mét (bán kính Trái Đất nhân với 10).
Thuộc tính HTML:
  • <gmp-map-3d min-altitude="number"></gmp-map-3d>
minHeading
Loại:  number optional
Góc tối thiểu của hướng (xoay) của bản đồ. Giá trị hợp lệ nằm trong khoảng từ 0 đến 360 độ. minHeadingmaxHeading biểu thị một khoảng thời gian <= 360 độ mà cử chỉ xoay đầu sẽ được cho phép. minHeading = 180maxHeading = 90 sẽ cho phép hướng đi ở [0, 90] và hướng đi ở [180, 360]. minHeading = 90maxHeading = 180 sẽ cho phép hướng đầu trong [90, 180].
Thuộc tính HTML:
  • <gmp-map-3d min-heading="number"></gmp-map-3d>
minTilt
Loại:  number optional
Góc tới tối thiểu của bản đồ. Giá trị hợp lệ nằm trong khoảng từ 0 đến 90 độ.
Thuộc tính HTML:
  • <gmp-map-3d min-tilt="number"></gmp-map-3d>
range
Loại:  number optional
Khoảng cách từ camera đến tâm của bản đồ, tính bằng mét.
Thuộc tính HTML:
  • <gmp-map-3d range="number"></gmp-map-3d>
roll
Loại:  number optional
Góc xoay của camera xung quanh vectơ chế độ xem (tính bằng độ). Để giải quyết sự mơ hồ, khi không có độ nghiêng, mọi độ xoay sẽ được hiểu là hướng.
Thuộc tính HTML:
  • <gmp-map-3d roll="number"></gmp-map-3d>
tilt
Loại:  number optional
Độ nghiêng của vectơ góc nhìn của camera tính bằng độ. Một vectơ hướng nhìn thẳng xuống trái đất sẽ có độ nghiêng là 0 độ. Một vectơ chế độ xem hướng ra xa trái đất sẽ có độ nghiêng là 180 độ.
Thuộc tính HTML:
  • <gmp-map-3d tilt="number"></gmp-map-3d>
BetaaddEventListener
addEventListener(type, listener[, options])
Tham số: 
  • typestring Một chuỗi phân biệt chữ hoa chữ thường, biểu thị loại sự kiện cần theo dõi.
  • listenerEventListener|EventListenerObject Đối tượng nhận thông báo. Đây phải là một hàm hoặc một đối tượng có phương thức handleEvent
  • optionsboolean|AddEventListenerOptions optional Xem các lựa chọn. Sự kiện tuỳ chỉnh chỉ hỗ trợ capturepassive.
Giá trị trả về:  void
Thiết lập một hàm sẽ được gọi bất cứ khi nào sự kiện được chỉ định được gửi đến đích. Xem addEventListener.
flyCameraAround
flyCameraAround(options)
Tham số: 
Giá trị trả về:  Không có
Phương thức này xoay camera quanh một vị trí nhất định trong một khoảng thời gian nhất định, tạo ra số vòng quay nhất định trong khoảng thời gian đó.

Theo mặc định, camera sẽ xoay theo chiều kim đồng hồ. Nếu bạn nhập một số âm cho số vòng, camera sẽ xoay theo hướng ngược chiều kim đồng hồ.

Phương thức này không đồng bộ vì ảnh động chỉ có thể bắt đầu sau khi bản đồ tải một lượng tối thiểu. Phương thức này sẽ trả về sau khi hiệu ứng chuyển động bắt đầu.

Nếu số vòng quay là 0, thì sẽ không có vòng quay nào diễn ra và ảnh động sẽ hoàn tất ngay sau khi bắt đầu.
flyCameraTo
flyCameraTo(options)
Tham số: 
Giá trị trả về:  Không có
Phương thức này di chuyển camera theo đường parabol từ vị trí hiện tại đến một vị trí cuối đã cho trong một khoảng thời gian nhất định.

Phương thức này không đồng bộ vì ảnh động chỉ có thể bắt đầu sau khi bản đồ tải một lượng tối thiểu. Phương thức này sẽ trả về sau khi hiệu ứng chuyển động bắt đầu.
BetaremoveEventListener
removeEventListener(type, listener[, options])
Tham số: 
Giá trị trả về:  void
Xoá một trình nghe sự kiện đã đăng ký trước đó bằng addEventListener khỏi đích. Xem removeEventListener.
stopCameraAnimation
stopCameraAnimation()
Tham số:  Không có
Giá trị trả về:  Không có
Phương thức này sẽ dừng mọi ảnh động bay có thể đang chạy. Camera vẫn ở nguyên vị trí trong quá trình tạo ảnh động; camera không dịch chuyển tức thời đến điểm cuối.

Phương thức này là không đồng bộ vì ảnh động chỉ có thể bắt đầu hoặc dừng sau khi bản đồ đã tải một lượng tối thiểu. Phương thức này sẽ trả về sau khi ảnh động dừng.
gmp-animationend
function(animationEndEvent)
Đối số: 
  • animationEndEventEvent
Sự kiện này được kích hoạt khi ảnh động bay kết thúc. Sự kiện này tạo chuỗi bọt (bong bóng) thông qua cây DOM.
gmp-centerchange
function(centerChangeEvent)
Đối số: 
  • centerChangeEventEvent
Sự kiện này sẽ kích hoạt khi thuộc tính tâm của Map3DElement thay đổi.
gmp-click
function(clickEvent)
Đối số: 
Sự kiện này được kích hoạt khi người dùng nhấp vào phần tử Map3DElement.
gmp-headingchange
function(headingChangeEvent)
Đối số: 
  • headingChangeEventEvent
Sự kiện này sẽ kích hoạt khi thuộc tính heading của Map3DElement thay đổi.
gmp-rangechange
function(rangeChangeEvent)
Đối số: 
  • rangeChangeEventEvent
Sự kiện này sẽ kích hoạt khi thuộc tính phạm vi của Map3DElement thay đổi.
gmp-rollchange
function(rollChangeEvent)
Đối số: 
  • rollChangeEventEvent
Sự kiện này sẽ kích hoạt khi thuộc tính roll của Map3DElement thay đổi.
gmp-steadychange
function(steadyChangeEvent)
Đối số: 
Sự kiện này được kích hoạt khi trạng thái ổn định của Map3DElement thay đổi.
gmp-tiltchange
function(tiltChangeEvent)
Đối số: 
  • tiltChangeEventEvent
Sự kiện này sẽ kích hoạt khi thuộc tính độ nghiêng của Map3DElement thay đổi.

Giao diện Map3DElementOptions

google.maps.maps3d.Map3DElementOptionsgiao diện

Đối tượng Map3DElementOptions dùng để xác định các thuộc tính có thể được đặt trên Map3DElement.

bounds optional
Vui lòng xem Map3DElement.bounds.
center optional
Vui lòng xem Map3DElement.center.
defaultLabelsDisabled optional
Loại:  boolean optional
defaultUIDisabled optional
Loại:  boolean optional
heading optional
Loại:  number optional
Vui lòng xem Map3DElement.heading.
maxAltitude optional
Loại:  number optional
maxHeading optional
Loại:  number optional
maxTilt optional
Loại:  number optional
Vui lòng xem Map3DElement.maxTilt.
minAltitude optional
Loại:  number optional
minHeading optional
Loại:  number optional
minTilt optional
Loại:  number optional
Vui lòng xem Map3DElement.minTilt.
range optional
Loại:  number optional
Vui lòng xem Map3DElement.range.
roll optional
Loại:  number optional
Vui lòng xem Map3DElement.roll.
tilt optional
Loại:  number optional
Vui lòng xem Map3DElement.tilt.

FlyAroundAnimationOptions giao diện

google.maps.maps3d.FlyAroundAnimationOptionsgiao diện

Các lựa chọn tuỳ chỉnh cho hiệu ứng FlyCameraAround.

camera
Loại:  CameraOptions
Điểm trung tâm mà camera sẽ hướng đến trong quá trình chuyển động quỹ đạo. Xin lưu ý rằng hướng của bản đồ sẽ thay đổi khi camera xoay quanh điểm trung tâm này.
durationMillis optional
Loại:  number optional
Thời lượng của ảnh động tính bằng mili giây. Đây là tổng thời lượng của ảnh động, chứ không phải thời lượng của một lần xoay.
rounds optional
Loại:  number optional
Số vòng xoay quanh tâm trong khoảng thời gian đã cho. Điều này kiểm soát tốc độ xoay tổng thể. Nếu truyền một số âm vào rounds, camera sẽ xoay ngược chiều kim đồng hồ thay vì theo chiều kim đồng hồ mặc định.

Giao diện FlyToAnimationOptions

google.maps.maps3d.FlyToAnimationOptionsgiao diện

Các lựa chọn tuỳ chỉnh cho ảnh động FlyCameraTo.

endCamera
Loại:  CameraOptions
Vị trí mà camera sẽ hướng đến khi kết thúc ảnh động.
durationMillis optional
Loại:  number optional
Thời lượng của ảnh động tính bằng mili giây. Thời lượng bằng 0 sẽ dịch chuyển camera thẳng đến vị trí cuối.

Giao diện CameraOptions

google.maps.maps3d.CameraOptionsgiao diện

Đối tượng CameraOptions dùng để xác định các thuộc tính có thể được đặt trên một đối tượng camera. Đối tượng camera có thể là bất cứ đối tượng nào có vị trí camera, ví dụ: trạng thái bản đồ hiện tại hoặc trạng thái ảnh động được yêu cầu trong tương lai.

center optional
Vui lòng xem Map3DElement.center.
heading optional
Loại:  number optional
Vui lòng xem Map3DElement.heading.
range optional
Loại:  number optional
Vui lòng xem Map3DElement.range.
roll optional
Loại:  number optional
Vui lòng xem Map3DElement.roll.