Draw on the map

Class MarkerElement

google.maps.maps3d.MarkerElement class
extends HTMLElement
implements MarkerElementOptions
library "maps3d"

Menampilkan posisi di peta 3D. Perhatikan bahwa position harus ditetapkan agar MarkerElement ditampilkan.

      
<gmp-marker
  altitude-mode="value-name"
  anchor-left="string"
  anchor-top="string"
  autofits-camera
  collision-behavior="value-name"
  collision-priority="number"
  position="lat,lng"
  title="string">
</gmp-marker>
 
const {MarkerElement} = await google.maps.importLibrary("maps3d");
MarkerElement
MarkerElement([options])
Parameter:
Membuat MarkerElement dengan opsi yang ditentukan.
altitudeMode
attr: altitude-mode
Jenis input: AltitudeMode optional
Jenis output: AltitudeMode
Default: AltitudeMode.CLAMP_TO_GROUND
Menentukan cara komponen ketinggian posisi ditafsirkan.
Atribut HTML: altitude-mode="value-name"
anchorLeft
attr: anchor-left
Jenis input: string optional
Jenis output: string
Default: -50%
Nilai persentase panjang CSS yang digunakan untuk mengimbangi titik anchor dari sudut kiri atas penanda. Hal ini berguna saat menggunakan visual yang memiliki titik anchor yang berbeda dari titik tengah bawah standar penanda default.
Atribut HTML: anchor-left="string"
anchorTop
attr: anchor-top
Jenis input: string optional
Jenis output: string
Default: -100%
Nilai persentase panjang CSS yang digunakan untuk mengimbangi titik anchor dari sudut kiri atas penanda. Hal ini berguna saat menggunakan visual yang memiliki titik anchor yang berbeda dari titik tengah bawah standar penanda default.
Atribut HTML: anchor-top="string"
AlphaautofitsCamera
attr: autofits-camera
Jenis: boolean optional
Default: false
Jika diberikan, penanda yang ditentukan akan terlihat dalam area pandang peta, bersama dengan elemen lain yang telah diikutsertakan.
Atribut HTML: autofits-camera
collisionBehavior
attr: collision-behavior
Jenis input: CollisionBehavior optional
Jenis output: CollisionBehavior
Default: CollisionBehavior.REQUIRED
Enumerasi yang menentukan perilaku MarkerElement saat tumpang-tindih dengan MarkerElement, Marker3DElement, atau label peta dasar lainnya.
Atribut HTML: collision-behavior="value-name"
collisionPriority
attr: collision-priority
Jenis input: number optional
Jenis output: number optional
Angka yang digunakan untuk membantu menentukan prioritas relatif di antara penanda CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY (termasuk Marker3DElement). Nilai collisionPriority yang lebih tinggi menunjukkan prioritas yang lebih tinggi.
Atribut HTML: collision-priority="number"
position
attr: position
Jenis input: LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional
Jenis output: LatLngAltitude optional
Lokasi ujung penanda. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
Atribut HTML:
  • position="lat,lng"
  • position="lat,lng,altitude"
title
attr: title
Jenis: string
Teks rollover. Jika disediakan, teks aksesibilitas (misalnya, untuk digunakan dengan pembaca layar) akan ditambahkan ke MarkerElement dengan nilai yang diberikan.
Atribut HTML: title="string"
default
Setiap elemen kustom yang ditambahkan langsung ke MarkerElement akan ditempatkan.
z-index
Indeks z penanda ini. Lihat dokumentasi z-index untuk mengetahui detail selengkapnya. Penanda yang tumpang-tindih dengan indeks z yang lebih besar akan menutupi penanda dengan indeks z yang lebih kecil. Secara default, penanda ditampilkan sesuai dengan posisi DOM-nya, dengan penanda yang ditambahkan kemudian di DOM muncul di depan penanda yang ditambahkan ke DOM sebelumnya.
Diwarisi: addEventListener, removeEventListener

Antarmuka MarkerElementOptions

Antarmuka google.maps.maps3d.MarkerElementOptions

Objek MarkerElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada MarkerElement.
altitudeMode
opsional
Jenis: AltitudeMode optional
Lihat MarkerElement.altitudeMode.
anchorLeft
opsional
Jenis: string optional
Lihat MarkerElement.anchorLeft.
anchorTop
opsional
Jenis: string optional
Lihat MarkerElement.anchorTop.
AlphaautofitsCamera
opsional
Jenis: boolean optional
Lihat AlphaMarkerElement.autofitsCamera.
collisionBehavior
opsional
Jenis: CollisionBehavior optional
Lihat MarkerElement.collisionBehavior.
collisionPriority
opsional
Jenis: number optional
Lihat MarkerElement.collisionPriority.
position
opsional
Lihat MarkerElement.position.
title
opsional
Jenis: string optional
Lihat MarkerElement.title.

Class MarkerInteractiveElement

google.maps.maps3d.MarkerInteractiveElement class
extends MarkerElement
implements MarkerInteractiveElementOptions
library "maps3d"

Menampilkan posisi di peta 3D. Perhatikan bahwa position harus ditetapkan agar MarkerInteractiveElement ditampilkan. Tidak seperti MarkerElement, MarkerInteractiveElement menerima peristiwa gmp-click.

<gmp-marker-interactive
  gmp-popover-target-element="popover-id">
</gmp-marker-interactive>
 
const {MarkerInteractiveElement} = await google.maps.importLibrary("maps3d");
MarkerInteractiveElement
MarkerInteractiveElement([options])
Parameter:
Membuat MarkerInteractiveElement dengan opsi yang ditentukan.
gmpPopoverTargetElement
attr: gmp-popover-target-element
Jenis input: PopoverElement optional
Jenis output: PopoverElement optional
Jika ditetapkan, elemen popover akan terbuka saat penanda ini diklik.
Atribut HTML: gmp-popover-target-element="popover-id"
Diwarisi: altitudeMode (attr: altitude-mode), anchorLeft (attr: anchor-left), anchorTop (attr: anchor-top), AlphaautofitsCamera (attr: autofits-camera), collisionBehavior (attr: collision-behavior), collisionPriority (attr: collision-priority), position (attr: position), title (attr: title)
Diwarisi: default
Diwarisi: z-index
Diwarisi: addEventListener, removeEventListener
gmp-click
function(clickEvent)
Argumen:
Peristiwa ini diaktifkan saat elemen MarkerInteractiveElement diklik.

Antarmuka MarkerInteractiveElementOptions

google.maps.maps3d.MarkerInteractiveElementOptions interface
extends MarkerElementOptions

Objek MarkerInteractiveElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada MarkerInteractiveElement.
gmpPopoverTargetElement
opsional
Jenis: PopoverElement optional
Lihat MarkerInteractiveElement.gmpPopoverTargetElement.
Diwarisi: altitudeMode, anchorLeft, anchorTop, AlphaautofitsCamera, collisionBehavior, collisionPriority, position, title

Class Marker3DElement

google.maps.maps3d.Marker3DElement class
extends HTMLElement
implements Marker3DElementOptions
library "maps3d"

Menampilkan posisi di peta 3D. Perhatikan bahwa position harus ditetapkan agar Marker3DElement ditampilkan.

     
<gmp-marker-3d
  altitude-mode="value-name"
  autofits-camera
  collision-behavior="value-name"
  collision-priority="number"
  draws-when-occluded
  extruded
  label="string"
  position="lat,lng"
  size-preserved
  z-index="number">
</gmp-marker-3d>
 
const {Marker3DElement} = await google.maps.importLibrary("maps3d");
Marker3DElement
Marker3DElement([options])
Parameter:
Membuat Marker3DElement dengan opsi yang ditentukan.
altitudeMode
attr: altitude-mode
Jenis input: AltitudeMode optional
Jenis output: AltitudeMode
Default: AltitudeMode.CLAMP_TO_GROUND
Menentukan cara komponen ketinggian posisi ditafsirkan.
Atribut HTML: altitude-mode="value-name"
AlphaautofitsCamera
attr: autofits-camera
Jenis input: boolean optional
Jenis output: boolean
Default: false
Jika diberikan, penanda yang ditentukan akan terlihat dalam area pandang peta, bersama dengan elemen lain yang telah diikutsertakan.
Atribut HTML: autofits-camera
collisionBehavior
attr: collision-behavior
Jenis input: CollisionBehavior optional
Jenis output: CollisionBehavior
Default: CollisionBehavior.REQUIRED
Enumerasi yang menentukan perilaku Marker3DElement saat tumpang-tindih dengan Marker3DElement lain atau dengan label peta dasar.
Atribut HTML: collision-behavior="value-name"
collisionPriority
attr: collision-priority
Jenis input: number optional
Jenis output: number optional
Prioritas tabrakan yang digunakan untuk deteksi tabrakan.
Atribut HTML: collision-priority="number"
drawsWhenOccluded
attr: draws-when-occluded
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah penanda ini harus digambar atau tidak saat terhalang. Penanda dapat terhalang oleh geometri peta (misalnya, bangunan).
Atribut HTML: draws-when-occluded
extruded
attr: extruded
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah akan menghubungkan penanda ke permukaan tanah. Untuk mengekstrusi penanda, altitudeMode harus berupa RELATIVE_TO_GROUND atau ABSOLUTE.
Atribut HTML: extruded
label
attr: label
Jenis input: string optional
Jenis output: string optional
Teks yang akan ditampilkan oleh penanda ini.
Atribut HTML: label="string"
position
attr: position
Jenis input: LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional
Jenis output: LatLngAltitude optional
Lokasi ujung penanda. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
Atribut HTML:
  • position="lat,lng"
  • position="lat,lng,altitude"
sizePreserved
attr: size-preserved
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah penanda ini harus mempertahankan ukurannya atau tidak, terlepas dari jaraknya dari kamera. Secara default, penanda diskalakan berdasarkan jarak dari kamera/kemiringan.
Atribut HTML: size-preserved
zIndex
attr: z-index
Jenis input: number optional
Jenis output: number optional
zIndex dibandingkan dengan penanda lainnya.
Atribut HTML: z-index="number"
default
Setiap elemen kustom yang langsung ditambahkan ke Marker3DElement akan ditempatkan, tetapi hanya elemen jenis HTMLImageElement, SVGElement, dan PinElement yang akan digunakan untuk menggambar penanda, elemen lainnya akan diabaikan.
HTMLImageElement dan SVGElement harus digabungkan dalam elemen <template> sebelum ditetapkan ke slot default Marker3DElement.

Gambar dan SVG saat ini diraster sebelum dirender dalam tampilan 3D, sehingga HTML kustom yang disematkan ke dalam SVG atau class CSS yang ditambahkan ke gambar tidak akan diterapkan dan mungkin tidak akan terlihat saat penanda ditampilkan di layar.
Diwarisi: addEventListener, removeEventListener

Antarmuka Marker3DElementOptions

Antarmuka google.maps.maps3d.Marker3DElementOptions

Objek Marker3DElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Marker3DElement.
altitudeMode
opsional
Jenis: AltitudeMode optional
Lihat Marker3DElement.altitudeMode.
AlphaautofitsCamera
opsional
Jenis: boolean optional
Lihat AlphaMarker3DElement.autofitsCamera.
collisionBehavior
opsional
Jenis: CollisionBehavior optional
Lihat Marker3DElement.collisionBehavior.
collisionPriority
opsional
Jenis: number optional
Lihat Marker3DElement.collisionPriority.
drawsWhenOccluded
opsional
Jenis: boolean optional
Lihat Marker3DElement.drawsWhenOccluded.
extruded
opsional
Jenis: boolean optional
Lihat Marker3DElement.extruded.
label
opsional
Jenis: string optional
Lihat Marker3DElement.label.
position
opsional
Lihat Marker3DElement.position.
sizePreserved
opsional
Jenis: boolean optional
Lihat Marker3DElement.sizePreserved.
zIndex
opsional
Jenis: number optional
Lihat Marker3DElement.zIndex.

Class Marker3DInteractiveElement

google.maps.maps3d.Marker3DInteractiveElement class
extends Marker3DElement
implements Marker3DInteractiveElementOptions
library "maps3d"

Menampilkan posisi di peta 3D. Perhatikan bahwa position harus ditetapkan agar Marker3DInteractiveElement ditampilkan. Tidak seperti Marker3DElement, Marker3DInteractiveElement menerima peristiwa gmp-click.

 
<gmp-marker-3d-interactive
  gmp-popover-target-element="popover-id"
  title="string">
</gmp-marker-3d-interactive>
 
const {Marker3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Marker3DInteractiveElement
Marker3DInteractiveElement([options])
Parameter:
Membuat Marker3DInteractiveElement dengan opsi yang ditentukan.
gmpPopoverTargetElement
attr: gmp-popover-target-element
Jenis input: PopoverElement optional
Jenis output: PopoverElement optional
Jika ditetapkan, elemen popover akan terbuka saat penanda ini diklik.
Atribut HTML: gmp-popover-target-element="popover-id"
title
attr: title
Jenis: string
Teks rollover. Jika disediakan, teks aksesibilitas (misalnya, untuk digunakan dengan pembaca layar) akan ditambahkan ke Marker3DInteractiveElement dengan nilai yang diberikan.
Atribut HTML: title="string"
Diwarisi: altitudeMode (attr: altitude-mode), AlphaautofitsCamera (attr: autofits-camera), collisionBehavior (attr: collision-behavior), collisionPriority (attr: collision-priority), drawsWhenOccluded (attr: draws-when-occluded), extruded (attr: extruded), label (attr: label), position (attr: position), sizePreserved (attr: size-preserved), zIndex (attr: z-index)
default
Setiap elemen kustom yang ditambahkan langsung ke Marker3DInteractiveElement akan ditempatkan, tetapi hanya elemen jenis PinElement yang akan digunakan untuk menggambar penanda, elemen lainnya akan diabaikan.
Diwarisi: addEventListener, removeEventListener
gmp-click
function(clickEvent)
Argumen:
Peristiwa ini diaktifkan saat elemen Marker3DInteractiveElement diklik.

Antarmuka Marker3DInteractiveElementOptions

google.maps.maps3d.Marker3DInteractiveElementOptions interface
extends Marker3DElementOptions

Objek Marker3DInteractiveElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Marker3DInteractiveElement.
gmpPopoverTargetElement
opsional
Jenis: PopoverElement optional
Lihat Marker3DInteractiveElement.gmpPopoverTargetElement.
title
opsional
Jenis: string optional
Lihat Marker3DInteractiveElement.title.
Diwarisi: altitudeMode, AlphaautofitsCamera, collisionBehavior, collisionPriority, drawsWhenOccluded, extruded, label, position, sizePreserved, zIndex

Class Model3DElement

google.maps.maps3d.Model3DElement class
extends HTMLElement
implements Model3DElementOptions
library "maps3d"

Model 3D yang memungkinkan rendering model gLTF. Perhatikan bahwa position dan src harus ditetapkan agar Model3DElement ditampilkan.

Properti inti gLTF PBR harus didukung. Saat ini, tidak ada ekstensi atau properti ekstensi yang didukung.

    
<gmp-model-3d
  altitude-mode="value-name"
  orientation="heading,tilt,roll"
  position="lat,lng"
  scale="number"
  src="url">
</gmp-model-3d>
 
const {Model3DElement} = await google.maps.importLibrary("maps3d");
Model3DElement
Model3DElement([options])
Parameter:
Membuat Model3DElement dengan opsi yang ditentukan.
altitudeMode
attr: altitude-mode
Jenis input: AltitudeMode optional
Jenis output: AltitudeMode
Default: AltitudeMode.CLAMP_TO_GROUND
Menentukan cara penafsiran ketinggian dalam posisi.
Atribut HTML: altitude-mode="value-name"
orientation
attr: orientation
Jenis input: Orientation3D|Orientation3DLiteral optional
Jenis output: Orientation3D optional
Menjelaskan rotasi sistem koordinat model 3D untuk memosisikan model di Peta 3D.

Rotasi diterapkan ke model dalam urutan berikut: roll, tilt, lalu heading.
Atribut HTML: orientation="heading,tilt,roll"
position
attr: position
Jenis input: LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optional
Jenis output: LatLngAltitude optional
Menetapkan posisi Model3DElement. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
Atribut HTML:
  • position="lat,lng"
  • position="lat,lng,altitude"
scale
attr: scale
Jenis input: number|Vector3D|Vector3DLiteral optional
Jenis output: Vector3D optional
Default: 1
Menskalakan model di sepanjang sumbu x, y, dan z dalam ruang koordinat model.
Atribut HTML:
  • scale="number"
  • scale="x,y,z"
src
attr: src
Jenis input: string|URL optional
Jenis output: URL optional
Menentukan URL model 3D. Saat ini, hanya model dalam format .glb yang didukung.

URL HTTP relatif apa pun akan di-resolve ke URL absolut yang sesuai.

Perhatikan bahwa jika Anda menghosting file model .glb di situs atau server yang berbeda dari aplikasi utama, pastikan untuk menyiapkan header HTTP CORS yang benar. Hal ini memungkinkan aplikasi Anda mengakses file model dari domain lain dengan aman.
Atribut HTML: src="url"
Diwarisi: addEventListener, removeEventListener

Antarmuka Model3DElementOptions

Antarmuka google.maps.maps3d.Model3DElementOptions

Objek Model3DElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Model3DElement.
altitudeMode
opsional
Jenis: AltitudeMode optional
Lihat Model3DElement.altitudeMode.
orientation
opsional
Lihat Model3DElement.orientation.
position
opsional
Lihat Model3DElement.position.
scale
opsional
Jenis: number|Vector3D|Vector3DLiteral optional
Lihat Model3DElement.scale.
src
opsional
Jenis: string|URL optional
Lihat Model3DElement.src.

Class Model3DInteractiveElement

google.maps.maps3d.Model3DInteractiveElement class
extends Model3DElement
implements Model3DInteractiveElementOptions
library "maps3d"

Model 3D yang memungkinkan rendering model gLTF. Perhatikan bahwa position dan src harus ditetapkan agar Model3DElement ditampilkan.

Properti inti gLTF PBR harus didukung. Saat ini, tidak ada ekstensi atau properti ekstensi yang didukung.

Tidak seperti Model3DElement, Model3DInteractiveElement menerima peristiwa gmp-click.

<gmp-model-3d-interactive></gmp-model-3d-interactive>
 
const {Model3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Model3DInteractiveElement
Model3DInteractiveElement([options])
Parameter:
Membuat Model3DInteractiveElement dengan opsi yang ditentukan.
Diwarisi: altitudeMode (attr: altitude-mode), orientation (attr: orientation), position (attr: position), scale (attr: scale), src (attr: src)
Diwarisi: addEventListener, removeEventListener
gmp-click
function(clickEvent)
Argumen:
Peristiwa ini diaktifkan saat elemen Model3DInteractiveElement diklik.

Antarmuka Model3DInteractiveElementOptions

google.maps.maps3d.Model3DInteractiveElementOptions interface
extends Model3DElementOptions

Objek Model3DInteractiveElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Model3DInteractiveElement.
Diwarisi: altitudeMode, orientation, position, scale, src

Polyline3DElement class

google.maps.maps3d.Polyline3DElement class
extends HTMLElement
implements Polyline3DElementOptions
library "maps3d"

Polyline 3D adalah overlay linear segmen garis terhubung pada peta 3D.

      
<gmp-polyline-3d
  altitude-mode="value-name"
  autofits-camera
  draws-occluded-segments
  extruded
  geodesic
  outer-color="string"
  outer-width="number"
  path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."
  stroke-color="string"
  stroke-width="number"
  z-index="number">
</gmp-polyline-3d>
 
const {Polyline3DElement} = await google.maps.importLibrary("maps3d");
Polyline3DElement
Polyline3DElement([options])
Parameter:
Membuat Polyline3DElement dengan opsi yang ditentukan.
altitudeMode
attr: altitude-mode
Jenis input: AltitudeMode optional
Jenis output: AltitudeMode
Default: AltitudeMode.CLAMP_TO_GROUND
Menentukan cara komponen ketinggian dalam koordinat ditafsirkan.
Atribut HTML: altitude-mode="value-name"
AlphaautofitsCamera
attr: autofits-camera
Jenis input: boolean optional
Jenis output: boolean
Default: false
Jika diberikan, polyline yang ditentukan akan terlihat dalam area pandang peta, bersama dengan elemen lain yang telah diikutsertakan.
Atribut HTML: autofits-camera
drawsOccludedSegments
attr: draws-occluded-segments
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah bagian polyline yang dapat terhalang digambar atau tidak. Polyline dapat terhalang oleh geometri peta (misalnya, bangunan).
Atribut HTML: draws-occluded-segments
extruded
attr: extruded
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah akan menghubungkan polyline ke permukaan tanah. Untuk mengekstrusi polyline, altitudeMode harus berupa RELATIVE_TO_GROUND atau ABSOLUTE.
Atribut HTML: extruded
geodesic
attr: geodesic
Jenis input: boolean optional
Jenis output: boolean
Default: false
Jika true, tepi polyline ditafsirkan sebagai geodesi dan akan mengikuti kelengkungan Bumi. Jika false, tepi polyline dirender sebagai garis lurus di ruang layar.
Atribut HTML: geodesic
outerColor
attr: outer-color
Jenis input: string optional
Jenis output: string optional
Warna luar. Semua warna CSS3 didukung.
Atribut HTML: outer-color="string"
outerWidth
attr: outer-width
Jenis input: number optional
Jenis output: number optional
Lebar luar antara 0.0 dan 1.0. Ini adalah persentase dari strokeWidth.
Atribut HTML: outer-width="number"
path
attr: path
Jenis input: Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional
Jenis output: Array<LatLngAltitude> optional
Urutan koordinat Polyline. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
Atribut HTML: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."
strokeColor
attr: stroke-color
Jenis input: string optional
Jenis output: string optional
Warna garis luar. Semua warna CSS3 didukung.
Atribut HTML: stroke-color="string"
strokeWidth
attr: stroke-width
Jenis input: number optional
Jenis output: number optional
Lebar garis luar dalam piksel.
Atribut HTML: stroke-width="number"
zIndex
attr: z-index
Jenis input: number optional
Jenis output: number optional
zIndex dibandingkan dengan poli lainnya.
Atribut HTML: z-index="number"
coordinates
Urutan koordinat Polyline. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
Diwarisi: addEventListener, removeEventListener

Antarmuka Polyline3DElementOptions

Antarmuka google.maps.maps3d.Polyline3DElementOptions

Objek Polyline3DElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Polyline3DElement.
altitudeMode
opsional
Jenis: AltitudeMode optional
Lihat Polyline3DElement.altitudeMode.
AlphaautofitsCamera
opsional
Jenis: boolean optional
Lihat AlphaPolyline3DElement.autofitsCamera.
coordinates
opsional
Lihat Polyline3DElement.coordinates.
drawsOccludedSegments
opsional
Jenis: boolean optional
Lihat Polyline3DElement.drawsOccludedSegments.
extruded
opsional
Jenis: boolean optional
Lihat Polyline3DElement.extruded.
geodesic
opsional
Jenis: boolean optional
Lihat Polyline3DElement.geodesic.
outerColor
opsional
Jenis: string optional
Lihat Polyline3DElement.outerColor.
outerWidth
opsional
Jenis: number optional
Lihat Polyline3DElement.outerWidth.
path
opsional
Lihat Polyline3DElement.path.
strokeColor
opsional
Jenis: string optional
Lihat Polyline3DElement.strokeColor.
strokeWidth
opsional
Jenis: number optional
Lihat Polyline3DElement.strokeWidth.
zIndex
opsional
Jenis: number optional
Lihat Polyline3DElement.zIndex.

Class Polyline3DInteractiveElement

google.maps.maps3d.Polyline3DInteractiveElement class
extends Polyline3DElement
implements Polyline3DInteractiveElementOptions
library "maps3d"

Polyline 3D adalah overlay linear segmen garis terhubung pada peta 3D. Tidak seperti Polyline3DElement, Polyline3DInteractiveElement menerima peristiwa gmp-click.

<gmp-polyline-3d-interactive></gmp-polyline-3d-interactive>
 
const {Polyline3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Polyline3DInteractiveElement
Polyline3DInteractiveElement([options])
Parameter:
Membuat Polyline3DInteractiveElement dengan opsi yang ditentukan.
Diwarisi: altitudeMode (attr: altitude-mode), AlphaautofitsCamera (attr: autofits-camera), drawsOccludedSegments (attr: draws-occluded-segments), extruded (attr: extruded), geodesic (attr: geodesic), outerColor (attr: outer-color), outerWidth (attr: outer-width), path (attr: path), strokeColor (attr: stroke-color), strokeWidth (attr: stroke-width), zIndex (attr: z-index), coordinates
Diwarisi: addEventListener, removeEventListener
gmp-click
function(clickEvent)
Argumen:
  • clickEvent: LocationClickEvent optional Objek peristiwa akan berisi lokasi lintang-bujur-ketinggian dari klik.
Peristiwa ini diaktifkan saat elemen Polyline3DInteractiveElement diklik.

Antarmuka Polyline3DInteractiveElementOptions

google.maps.maps3d.Polyline3DInteractiveElementOptions interface
extends Polyline3DElementOptions

Objek Polyline3DInteractiveElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Polyline3DInteractiveElement.
Diwarisi: altitudeMode, AlphaautofitsCamera, coordinates, drawsOccludedSegments, extruded, geodesic, outerColor, outerWidth, path, strokeColor, strokeWidth, zIndex

Class Polygon3DElement

google.maps.maps3d.Polygon3DElement class
extends HTMLElement
implements Polygon3DElementOptions
library "maps3d"

Poligon 3D (seperti polyline 3D) menentukan serangkaian koordinat yang terhubung dalam urutan yang berurutan. Selain itu, poligon membentuk loop tertutup dan menentukan region yang terisi.

    
<gmp-polygon-3d
  autofits-camera
  draws-occluded-segments
  extruded
  fill-color="string"
  geodesic
  path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."
  stroke-color="string"
  stroke-width="number"
  z-index="number">
</gmp-polygon-3d>
 
const {Polygon3DElement} = await google.maps.importLibrary("maps3d");
Polygon3DElement
Polygon3DElement([options])
Parameter:
Membuat Polygon3DElement dengan opsi yang ditentukan.
altitudeMode
Jenis input: AltitudeMode optional
Jenis output: AltitudeMode
Default: AltitudeMode.CLAMP_TO_GROUND
Menentukan cara komponen ketinggian dalam koordinat ditafsirkan.
AlphaautofitsCamera
attr: autofits-camera
Jenis input: boolean optional
Jenis output: boolean
Default: false
Jika diberikan, poligon yang ditentukan akan terlihat dalam area pandang peta, bersama dengan elemen lain yang telah diikutsertakan.
Atribut HTML: autofits-camera
drawsOccludedSegments
attr: draws-occluded-segments
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah bagian poligon yang dapat terhalang digambar atau tidak. Poligon dapat terhalang oleh geometri peta (misalnya, bangunan).
Atribut HTML: draws-occluded-segments
extruded
attr: extruded
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah akan menghubungkan poligon ke permukaan tanah. Untuk mengekstrusi poligon, altitudeMode harus berupa RELATIVE_TO_GROUND atau ABSOLUTE.
Atribut HTML: extruded
fillColor
attr: fill-color
Jenis input: string optional
Jenis output: string optional
Warna pengisi. Semua warna CSS3 didukung.
Atribut HTML: fill-color="string"
geodesic
attr: geodesic
Jenis input: boolean optional
Jenis output: boolean
Default: false
Jika true, tepi poligon ditafsirkan sebagai geodesi dan akan mengikuti kelengkungan Bumi. Jika false, tepi poligon dirender sebagai garis lurus di ruang layar.
Atribut HTML: geodesic
innerPaths
Urutan koordinat yang berurutan yang menetapkan loop tertutup. Tidak seperti polyline, poligon dapat terdiri dari satu atau beberapa jalur, yang membuat beberapa potongan di dalam poligon.
path
attr: path
Jenis input: Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional
Jenis output: Array<LatLngAltitude> optional
Urutan koordinat yang berurutan yang menetapkan loop tertutup. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
Atribut HTML: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."
strokeColor
attr: stroke-color
Jenis input: string optional
Jenis output: string optional
Warna garis luar. Semua warna CSS3 didukung.
Atribut HTML: stroke-color="string"
strokeWidth
attr: stroke-width
Jenis input: number optional
Jenis output: number optional
Lebar garis luar dalam piksel.
Atribut HTML: stroke-width="number"
zIndex
attr: z-index
Jenis input: number optional
Jenis output: number optional
zIndex dibandingkan dengan poli lainnya.
Atribut HTML: z-index="number"
outerCoordinates
Urutan koordinat yang berurutan yang menetapkan loop tertutup. Ketinggian diabaikan dalam mode tertentu, sehingga bersifat opsional.
innerCoordinates
Urutan koordinat yang berurutan yang menetapkan loop tertutup. Tidak seperti polyline, poligon dapat terdiri dari satu atau beberapa jalur, yang membuat beberapa potongan di dalam poligon.
Diwarisi: addEventListener, removeEventListener

Antarmuka Polygon3DElementOptions

Antarmuka google.maps.maps3d.Polygon3DElementOptions

Objek Polygon3DElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Polygon3DElement.
altitudeMode
opsional
Jenis: AltitudeMode optional
Lihat Polygon3DElement.altitudeMode.
AlphaautofitsCamera
opsional
Jenis: boolean optional
Lihat AlphaPolygon3DElement.autofitsCamera.
drawsOccludedSegments
opsional
Jenis: boolean optional
Lihat Polygon3DElement.drawsOccludedSegments.
extruded
opsional
Jenis: boolean optional
Lihat Polygon3DElement.extruded.
fillColor
opsional
Jenis: string optional
Lihat Polygon3DElement.fillColor.
geodesic
opsional
Jenis: boolean optional
Lihat Polygon3DElement.geodesic.
innerCoordinates
opsional
Lihat Polygon3DElement.innerCoordinates.
innerPaths
opsional
Lihat Polygon3DElement.innerPaths.
outerCoordinates
opsional
Lihat Polygon3DElement.outerCoordinates.
path
opsional
Lihat Polygon3DElement.path.
strokeColor
opsional
Jenis: string optional
Lihat Polygon3DElement.strokeColor.
strokeWidth
opsional
Jenis: number optional
Lihat Polygon3DElement.strokeWidth.
zIndex
opsional
Jenis: number optional
Lihat Polygon3DElement.zIndex.

Class Polygon3DInteractiveElement

google.maps.maps3d.Polygon3DInteractiveElement class
extends Polygon3DElement
implements Polygon3DInteractiveElementOptions
library "maps3d"

Poligon 3D (seperti polyline 3D) menentukan serangkaian koordinat yang terhubung dalam urutan yang berurutan. Selain itu, poligon membentuk loop tertutup dan menentukan region yang terisi. Tidak seperti Polygon3DElement, Polygon3DInteractiveElement menerima peristiwa gmp-click.

<gmp-polygon-3d-interactive></gmp-polygon-3d-interactive>
 
const {Polygon3DInteractiveElement} = await google.maps.importLibrary("maps3d");
Polygon3DInteractiveElement
Polygon3DInteractiveElement([options])
Parameter:
Membuat Polygon3DInteractiveElement dengan opsi yang ditentukan.
Diwarisi: altitudeMode, AlphaautofitsCamera (attr: autofits-camera), drawsOccludedSegments (attr: draws-occluded-segments), extruded (attr: extruded), fillColor (attr: fill-color), geodesic (attr: geodesic), innerPaths, path (attr: path), strokeColor (attr: stroke-color), strokeWidth (attr: stroke-width), zIndex (attr: z-index), outerCoordinates, innerCoordinates
Diwarisi: addEventListener, removeEventListener
gmp-click
function(clickEvent)
Argumen:
  • clickEvent: LocationClickEvent optional Objek peristiwa akan berisi lokasi lintang-bujur-ketinggian dari klik.
Peristiwa ini diaktifkan saat elemen Polygon3DInteractiveElement diklik.

Antarmuka Polygon3DInteractiveElementOptions

google.maps.maps3d.Polygon3DInteractiveElementOptions interface
extends Polygon3DElementOptions

Objek Polygon3DInteractiveElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada Polygon3DInteractiveElement.
Diwarisi: altitudeMode, AlphaautofitsCamera, drawsOccludedSegments, extruded, fillColor, geodesic, innerCoordinates, innerPaths, outerCoordinates, path, strokeColor, strokeWidth, zIndex

Class FlattenerElement

google.maps.maps3d.FlattenerElement class
extends HTMLElement
implements FlattenerElementOptions
library "maps3d"

Elemen perata digunakan untuk meratakan area tertentu di peta.

<gmp-flattener
  path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ...">
</gmp-flattener>
 
const {FlattenerElement} = await google.maps.importLibrary("maps3d");
FlattenerElement
FlattenerElement([options])
Parameter:
innerPaths
Urutan koordinat yang berurutan yang menetapkan loop tertutup. Jalur ini menentukan Lubang Pengecualian dalam jalur utama poligon, yaitu Zona Perataan. Area dalam innerPath dikecualikan dari perataan.
path
attr: path
Jenis input: Iterable<LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral> optional
Jenis output: Array<LatLngAltitude> optional
Urutan koordinat yang berurutan yang menetapkan loop tertutup. Siklus ini menentukan Zona Perataan.
Atribut HTML: path="lat1,lng1,altitude1 lat2,lng2,altitude2 lat3,lng3,altitude3 ..."
Diwarisi: addEventListener, removeEventListener

Antarmuka FlattenerElementOptions

Antarmuka google.maps.maps3d.FlattenerElementOptions

Objek FlattenerElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada FlattenerElement.
innerPaths
opsional
Lihat FlattenerElement.innerPaths.
path
opsional
Lihat FlattenerElement.path.

Class PopoverElement

google.maps.maps3d.PopoverElement class
extends HTMLElement
implements PopoverElementOptions
library "maps3d"

Elemen HTML kustom yang merender popover. Bentuknya seperti balon dan sering kali terhubung ke penanda.

<gmp-popover
  auto-pan-disabled
  light-dismiss-disabled
  open
  position-anchor="lat,lng">
</gmp-popover>
 
const {PopoverElement} = await google.maps.importLibrary("maps3d");
PopoverElement
PopoverElement([options])
Parameter:
altitudeMode
Jenis input: AltitudeMode optional
Jenis output: AltitudeMode
Default: AltitudeMode.CLAMP_TO_GROUND
Menentukan cara komponen ketinggian posisi ditafsirkan.
autoPanDisabled
attr: auto-pan-disabled
Jenis input: boolean optional
Jenis output: boolean
Default: false
Jika disetel ke benar (true), akan menonaktifkan penggeseran peta untuk membuat popover terlihat sepenuhnya saat dibuka.
Atribut HTML: auto-pan-disabled
lightDismissDisabled
attr: light-dismiss-disabled
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah popover ini harus "ditutup ringan" atau tidak. Perilaku "tutup ringan" mirip dengan menyetel atribut popover="auto" yang merupakan bagian dari Popover API browser.
Atribut HTML: light-dismiss-disabled
open
attr: open
Jenis input: boolean optional
Jenis output: boolean
Default: false
Menentukan apakah popover ini harus terbuka atau tidak.
Atribut HTML: open
positionAnchor
attr: position-anchor
Posisi untuk menampilkan popover ini. Jika popover ditambatkan ke penanda interaktif, posisi penanda akan digunakan.
Atribut HTML:
  • position-anchor="lat,lng"
  • position-anchor="lat,lng,altitude"
  • position-anchor="marker-id"
default
Menempatkan konten slot di bagian utama popover.
header
Menempatkan konten slot di bagian judul popover.
--gmp-popover-max-width
Lebar maksimum popover, terlepas dari lebar konten.
--gmp-popover-min-width
Lebar minimum popover, terlepas dari lebar konten. Saat menggunakan properti ini, sebaiknya tetapkan ke nilai yang lebih kecil dari lebar peta (dalam piksel).
--gmp-popover-pixel-offset-x
Offset pada sumbu x, dalam piksel, dari ujung popover dari titik di peta yang koordinat geografisnya menjadi titik anchor popover.
--gmp-popover-pixel-offset-y
Offset pada sumbu y, dalam piksel, dari ujung popover dari titik di peta yang koordinat geografisnya menjadi tempat popover ditambatkan.
background-color
Warna latar belakang popover. Lihat dokumentasi background-color untuk mengetahui detail selengkapnya. Perhatikan bahwa popover tempat default juga terpengaruh oleh properti ini. Gunakan class CSS yang ditargetkan atau gaya inline pada popover kustom untuk menghindari penataan gaya popover tempat default.
border-radius
Radius batas popover. Lihat dokumentasi border-radius untuk mengetahui detail selengkapnya. Perhatikan bahwa popover tempat default juga terpengaruh oleh properti ini. Gunakan class CSS yang ditargetkan atau gaya inline pada popover kustom untuk menghindari penataan gaya popover tempat default.
box-shadow
Bayangan kotak popover. Lihat dokumentasi box-shadow untuk mengetahui detail selengkapnya. Perhatikan bahwa popover tempat default juga terpengaruh oleh properti ini. Gunakan class CSS yang ditargetkan atau gaya inline pada popover kustom untuk menghindari penataan gaya popover tempat default.
color-scheme
Menunjukkan skema warna yang dapat digunakan untuk merender popover ini. Lihat dokumentasi color-scheme untuk mengetahui detail selengkapnya. Jika tidak ditentukan, setelan ini akan ditetapkan secara default ke preferensi skema warna pengguna.
padding
Padding popover. Lihat dokumentasi padding untuk mengetahui detail selengkapnya. Perhatikan bahwa popover tempat default juga terpengaruh oleh properti ini. Gunakan class CSS yang ditargetkan atau gaya inline pada popover kustom untuk menghindari penataan gaya popover tempat default.
Diwarisi: addEventListener, removeEventListener

Antarmuka PopoverElementOptions

Antarmuka google.maps.maps3d.PopoverElementOptions

Objek PopoverElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada PopoverElement.
altitudeMode
opsional
Jenis: AltitudeMode optional
Lihat PopoverElement.altitudeMode.
autoPanDisabled
opsional
Jenis: boolean optional
Lihat PopoverElement.autoPanDisabled.
lightDismissDisabled
opsional
Jenis: boolean optional
Lihat PopoverElement.lightDismissDisabled.
open
opsional
Jenis: boolean optional
Lihat PopoverElement.open.
positionAnchor
opsional
Lihat PopoverElement.positionAnchor.

Konstanta AltitudeMode

google.maps.maps3d.AltitudeMode konstanta library
"maps3d"

Menentukan cara komponen ketinggian dalam koordinat ditafsirkan.

Konstanta ini juga dapat digunakan sebagai string. Di TypeScript, literal string ditentukan oleh jenis AltitudeModeString.

const {AltitudeMode} = await google.maps.importLibrary("maps3d");
ABSOLUTE Memungkinkan untuk mengekspresikan objek yang relatif terhadap permukaan laut rata-rata. Artinya, jika tingkat detail medan berubah di bawah objek, posisi absolutnya akan tetap sama.
CLAMP_TO_GROUND Memungkinkan untuk mengekspresikan objek yang ditempatkan di permukaan tanah. Ikon tersebut akan tetap berada di permukaan tanah mengikuti medan, terlepas dari ketinggian yang diberikan. Jika objek diposisikan di atas perairan besar, objek tersebut akan ditempatkan di permukaan laut.
RELATIVE_TO_GROUND Memungkinkan untuk mengekspresikan objek yang terkait dengan permukaan tanah. Jika tingkat detail medan berubah, posisi objek akan tetap konstan terhadap permukaan tanah. Jika berada di atas air, ketinggian akan ditafsirkan sebagai nilai dalam meter di atas permukaan laut.
RELATIVE_TO_MESH Memungkinkan untuk mengekspresikan objek yang sesuai dengan permukaan tanah+bangunan+permukaan air tertinggi. Jika di atas air, ini akan menjadi permukaan air; jika di atas medan, ini akan menjadi permukaan bangunan (jika ada) atau permukaan tanah (jika tidak ada bangunan).

Class CirclePathElement

google.maps.maps3d.CirclePathElement class
extends HTMLElement
implements CirclePathElementOptions
library "maps3d"

Overlay lingkaran 3D pada peta 3D.

 
<gmp-circle-path
  center="lat,lng,altitude"
  radius="number">
</gmp-circle-path>
 
const {CirclePathElement} = await google.maps.importLibrary("maps3d");
CirclePathElement
CirclePathElement([options])
Parameter:
Membuat CirclePathElement dengan opsi yang ditentukan.
center
attr: center
Jenis input: LatLngAltitude|LatLngAltitudeLiteral|LatLngLiteral optional
Jenis output: LatLngAltitude optional
Pusat lingkaran.
Atribut HTML: center="lat,lng,altitude"
radius
attr: radius
Jenis input: number optional
Jenis output: number optional
Radius lingkaran dalam meter.
Atribut HTML: radius="number"
Diwarisi: addEventListener, removeEventListener

Antarmuka CirclePathElementOptions

Antarmuka google.maps.maps3d.CirclePathElementOptions

Objek CirclePathElementOptions yang digunakan untuk menentukan properti yang dapat ditetapkan pada CirclePathElement.
center
opsional
Lihat CirclePathElement.center.
radius
opsional
Jenis: number optional
Lihat CirclePathElement.radius.