Maps

Kelas MapElement

Class google.maps.MapElement

MapElement adalah subclass HTMLElement untuk merender peta. Setelah memuat library maps, peta dapat dibuat di HTML. Contoh: 

<gmp-map center="37.4220656,-122.0840897" zoom="10" map-id="DEMO_MAP_ID">
  <button slot="control-block-start-inline-end">Custom Control</button>
</gmp-map>
Secara internal, menggunakan Map, yang dapat diakses dengan properti MapElement.innerMap.

Elemen kustom:
<gmp-map center="lat,lng" heading-interaction-disabled internal-usage-attribution-ids="id1 id2" map-id="string" rendering-type="vector" tilt-interaction-disabled zoom="number"></gmp-map>

Class ini memperluas HTMLElement.

Class ini mengimplementasikan MapElementOptions.

Akses dengan memanggil const {MapElement} = await google.maps.importLibrary("maps").
Lihat Library di Maps JavaScript API.
MapElement
MapElement([options])
Parameter: 
center
Jenis:  LatLng|LatLngLiteral optional
Lintang/bujur tengah peta.
Atribut HTML:
  • <gmp-map center="lat,lng"></gmp-map>
headingInteractionDisabled
Jenis:  boolean optional
Default: false
Apakah peta harus mengizinkan kontrol pengguna terhadap arah kamera (rotasi). Opsi ini hanya berlaku jika peta adalah peta vektor. Jika tidak disetel dalam kode, konfigurasi cloud untuk ID peta akan digunakan (jika tersedia).
Atribut HTML:
  • <gmp-map heading-interaction-disabled></gmp-map>
innerMap
Jenis:  Map
Referensi ke Map yang digunakan MapElement secara internal.
internalUsageAttributionIds
Jenis:  Iterable<string> optional
Default: null
Menambahkan ID atribusi penggunaan ke penginisialisasi, yang membantu Google memahami library dan contoh mana yang bermanfaat bagi developer, seperti penggunaan library pengelompokan penanda. Untuk memilih tidak mengirimkan ID atribusi penggunaan, Anda dapat menghapus properti ini atau mengganti nilainya dengan string kosong. Hanya nilai unik yang akan dikirim. Perubahan pada nilai ini setelah instansiasi dapat diabaikan.
Atribut HTML:
  • <gmp-map internal-usage-attribution-ids="id1 id2"></gmp-map>
mapId
Jenis:  string optional
ID peta peta. Parameter ini tidak dapat ditetapkan atau diubah setelah peta di-instansiasi. Map.DEMO_MAP_ID dapat digunakan untuk mencoba fitur yang memerlukan ID peta, tetapi tidak memerlukan pengaktifan cloud.
Atribut HTML:
  • <gmp-map map-id="string"></gmp-map>
renderingType
Jenis:  RenderingType optional
Default: RenderingType.VECTOR
Apakah peta harus berupa peta raster atau vektor. Parameter ini tidak dapat ditetapkan atau diubah setelah peta di-instansiasi. Jika tidak disetel, konfigurasi cloud untuk ID peta akan menentukan jenis rendering (jika tersedia). Perhatikan bahwa peta vektor mungkin tidak tersedia untuk semua perangkat dan browser, dan peta akan kembali ke peta raster sesuai kebutuhan.
Atribut HTML:
  • <gmp-map rendering-type="vector"></gmp-map>
  • <gmp-map rendering-type="raster"></gmp-map>
tiltInteractionDisabled
Jenis:  boolean optional
Default: false
Apakah peta harus mengizinkan kontrol kemiringan kamera oleh pengguna. Opsi ini hanya berlaku jika peta adalah peta vektor. Jika tidak disetel dalam kode, konfigurasi cloud untuk ID peta akan digunakan (jika tersedia).
Atribut HTML:
  • <gmp-map tilt-interaction-disabled></gmp-map>
zoom
Jenis:  number optional
Tingkat zoom peta. Nilai zoom yang valid adalah angka dari nol hingga tingkat zoom maksimum yang didukung. Nilai zoom yang lebih besar sesuai dengan resolusi yang lebih tinggi.
Atribut HTML:
  • <gmp-map zoom="number"></gmp-map>
control-block-end-inline-center
Menempatkan elemen slot di posisi ControlPosition.BLOCK_END_INLINE_CENTER.
control-block-end-inline-end
Menempatkan elemen slot di posisi ControlPosition.BLOCK_END_INLINE_END.
control-block-end-inline-start
Menempatkan elemen slot di posisi ControlPosition.BLOCK_END_INLINE_START.
control-block-start-inline-center
Menempatkan elemen slot di posisi ControlPosition.BLOCK_START_INLINE_CENTER.
control-block-start-inline-end
Menempatkan elemen slot di posisi ControlPosition.BLOCK_START_INLINE_END.
control-block-start-inline-start
Menempatkan elemen slot di posisi ControlPosition.BLOCK_START_INLINE_START.
control-inline-end-block-center
Menempatkan elemen slot di posisi ControlPosition.INLINE_END_BLOCK_CENTER.
control-inline-end-block-end
Menempatkan elemen slot di posisi ControlPosition.INLINE_END_BLOCK_END.
control-inline-end-block-start
Menempatkan elemen slot di posisi ControlPosition.INLINE_END_BLOCK_START.
control-inline-start-block-center
Menempatkan elemen slot di posisi ControlPosition.INLINE_START_BLOCK_CENTER.
control-inline-start-block-end
Menempatkan elemen slot di posisi ControlPosition.INLINE_START_BLOCK_END.
control-inline-start-block-start
Menempatkan elemen slot di posisi ControlPosition.INLINE_START_BLOCK_START.
default
Anda dapat membuat komponen yang dapat digunakan kembali di sekitar Komponen Web Maps JavaScript, seperti AdvancedMarkerElement, menggunakan elemen kustom. Secara default, elemen kustom yang ditambahkan langsung ke MapElement akan dimasukkan dan dirender di