Gaya visual peta berbasis Cloud

Pilih platform: Android iOS JavaScript Web Service

Google Maps Platform menawarkan fitur gaya visual peta berbasis Cloud yang memudahkan Anda untuk menata gaya, menyesuaikan, dan mengelola peta menggunakan Google Cloud Console, sehingga Anda dapat membuat pengalaman peta yang disesuaikan untuk pengguna tanpa harus memperbarui kode aplikasi setiap kali Anda membuat perubahan gaya.

Gaya yang dibuat sebelum 15 September 2020 tidak akan menampilkan fitur alami yang ditingkatkan pada Google Maps. Guna memanfaatkan dukungan fitur alami yang ditingkatkan pada Google Maps untuk gaya visual peta, Anda harus membuat Gaya peta.

Gaya visual peta berbasis Cloud memungkinkan Anda membuat dan mengedit gaya peta untuk setiap aplikasi yang menggunakan Google Maps, tanpa memerlukan perubahan pada kode setelah ID peta diterapkan. Semua perubahan gaya dapat dilakukan di Cloud Console, tanpa memerlukan keahlian coding. Ubah tampilan dan warna berbagai elemen peta seperti jalan, bangunan, perairan, lokasi menarik, dan rute transportasi umum.

Fitur-fitur ini meliputi:

  • Gaya visual peta berbasis cloud: Daripada menata gaya peta dalam kode menggunakan JSON, Anda dapat mengelola dan menata gaya peta dinamis dan statis di Cloud Console menggunakan ID Peta dan gaya peta.
  • Peta Vektor: Developer JavaScript dapat memilih untuk menggunakan peta berbasis vektor yang diakselerasi oleh WebGL yang sama yang tersedia di maps.google.com secara langsung di aplikasi web mereka sendiri.
  • Pemfilteran POI bisnis: Lima kategori lokasi menarik bisnis dapat dihapus dari tampilan peta.
  • Kontrol Kepadatan POI: Kepadatan lokasi menarik yang ditampilkan di peta dasar dapat disesuaikan untuk menampilkan lebih banyak atau lebih sedikit lokasi menarik secara default.

Meskipun gaya visual peta berbasis Cloud tersedia di Maps SDK for Android1, Maps SDK for iOS, JavaScript, dan Maps Static API, tidak semua fiturnya dapat dilihat di semua platform.

Sebelum memulai

  • Buat ID peta
    Untuk menggunakan gaya visual peta berbasis Cloud, peta Anda harus dimuat menggunakan ID peta.
  • Migrasi dari gaya visual hard code
    Sebelum menambahkan ID peta untuk menggunakan gaya visual peta berbasis Cloud pada peta yang ada dan disesuaikan dengan gaya visual hard code, seperti parameter kueri URL atau JSON, sebaiknya hapus gaya visual hard code untuk menghindari potensi konflik dengan fungsi pada masa mendatang. Anda dapat mengimpor gaya visual JSON ke gaya peta baru.

Penagihan

Penggunaan gaya visual peta berbasis Cloud memerlukan ID peta. Di Maps SDK for Android, Maps SDK for iOS, dan JavaScript, menggunakan ID peta akan dikenai biaya atas SKU Dynamic Maps. Di Maps Static API, penggunaan ID peta akan dikenai biaya atas SKU Static Maps.

Contoh

Ini adalah contoh dasar dari pemuatan peta bergaya kustom menggunakan ID peta. Dalam hal ini, Maps JavaScript mereferensikan ID peta 8e0a97af9386fef saat peta dimuat, dan otomatis menerapkan gaya peta yang saat ini terkait dengan ID peta tersebut.

TypeScript

function initMap(): void {
  new google.maps.Map(
    document.getElementById("map") as HTMLElement,
    {
      mapId: "8e0a97af9386fef",
      center: { lat: 48.85, lng: 2.35 },
      zoom: 12,
    } as google.maps.MapOptions
  );
}

declare global {
  interface Window {
    initMap: () => void;
  }
}
window.initMap = initMap;

JavaScript

function initMap() {
  new google.maps.Map(document.getElementById("map"), {
    mapId: "8e0a97af9386fef",
    center: { lat: 48.85, lng: 2.35 },
    zoom: 12,
  });
}

window.initMap = initMap;
Lihat contoh

Mencoba Contoh


  1. Gaya visual peta berbasis Cloud tidak tersedia di Mode Ringan Android