Anda sudah siap!

Untuk mulai mengembangkan, masuklah ke dokumentasi developer kami.

Aktifkan Google Static Maps API

Untuk membantu Anda memulai, kami akan memandu Anda melalui Google Developers Console untuk melakukan beberapa hal terlebih dahulu:

  1. Buat atau pilih sebuah proyek
  2. Aktifkan Google Static Maps API
  3. Buat kunci yang sesuai
Lanjutkan

Peta Bergaya

Menyesuaikan penyajian peta Google standar dengan menerapkan gaya Anda sendiri ketika menggunakan Google Static Maps API. Anda bisa mengubah tampilan visual fitur seperti jalan, taman, area padat bangunan, dan tempat menarik lainnya. Mengubah warna atau gaya untuk menegaskan materi tertentu, saling melengkapi dengan materi laman di sekitarnya, atau menyembunyikan fitur sepenuhnya.

Contoh

Contoh berikut menampilkan peta Brooklyn, AS, dengan penataan gaya untuk memberikan warna jalan lokal hijau terang dan daerah pemukiman berwarna hitam. Hal ini juga membalikkan kecerahan label, sehingga mereka terlihat lebih menonjol pada latar belakang gelap. Perhatikan bahwa contoh yang bekerja ini menggunakan URL enkode:

https://maps.googleapis.com/maps/api/staticmap?size=512x512&zoom=15&center=Brooklyn&style=feature:road.local%7Celement:geometry%7Ccolor:0x00ff00&style=feature:landscape%7Celement:geometry.fill%7Ccolor:0x000000&style=element:labels%7Cinvert_lightness:true&style=feature:road.arterial%7Celement:labels%7Cinvert_lightness:false&key=YOUR_API_KEY

Contoh berikut menggunakan operasi penataan gaya dan penyederhanaan untuk memperkirakan tampilan peta jalan Amerika Serikat:

https://maps.googleapis.com/maps/api/staticmap?size=512x512&zoom=12&center=Chicago&format=png&style=feature:road.highway%7Celement:geometry%7Cvisibility:simplified%7Ccolor:0xc280e9&style=feature:transit.line%7Cvisibility:simplified%7Ccolor:0xbababa&style=feature:road.highway%7Celement:labels.text.stroke%7Cvisibility:on%7Ccolor:0xb06eba&style=feature:road.highway%7Celement:labels.text.fill%7Cvisibility:on%7Ccolor:0xffffff&key=YOUR_API_KEY

Sintaks gaya

Untuk membuat peta bergaya yang disesuaikan, sertakan satu atau beberapa parameter style dalam URL permintaan.

Setiap deklarasi style bisa berisi argumen berikut, dipisahkan dengan karakter pipa ("|"):

  • feature (opsional) menunjukkan fitur yang akan dipilih untuk modifikasi gaya ini. Fitur meliputi hal-hal di peta, seperti jalan, taman, atau tempat menarik lainnya. Jika tidak terdapat argumen feature, gaya yang telah ditetapkan berlaku untuk semua fitur.
  • element (opsional) menunjukkan elemen dari fitur yang ditetapkan untuk memilih modifikasi gaya ini. Elemen adalah karakteristik dari fitur, seperti geometri atau label. Jika tidak terdapat argumen element, gaya berlaku untuk semua elemen dari fitur yang ditetapkan.
  • Sekumpulan aturan gaya (wajib) untuk mengaplikasikan fitur dan elemen yang ditetapkan. API menerapkan aturan dalam urutan kemunculannya di deklarasi style. Anda bisa menyertakan sejumlah aturan, dalam batasan panjang-URL normal Google Static Maps API.

Catatan: deklarasi style harus menetapkan argumen di atas dalam urutan yang ditetapkan. Contoh berikut memberikan sintaks yang benar untuk seleksi fitur dan elemen dengan dua aturan:

style=feature:myFeatureArgument|element:myElementArgument|myRule1:myRule1Argument|myRule2:myRule2Argument

Fitur

Deklarasi style berikut mewarnai semua jalan pada peta:

style=feature:road|color:0xffffff

Berikut adalah beberapa pilihan fitur umum:

  • feature:all (default) memilih semua fitur peta.
  • feature:road memilih semua jalan di peta.
  • feature:road.local memilih semua jalan lokal.

Fitur, atau tipe fitur, adalah karakteristik geografis pada peta, termasuk jalan, taman, badan air, bisnis, dan lainnya.

Fitur membentuk pohon hierarki kategori, dengan all sebagai akarnya. Jika Anda tidak menetapkan suatu fitur, semua fitur akan dipilih. Menetapkan fitur all memiliki efek yang sama.

Sebagian fitur berisi fitur anak yang Anda tetapkan menggunakan notasi titik. Misalnya, landscape.natural atau road.local. Jika Anda menetapkan fitur induk, misalnya road, gaya yang Anda tetapkan untuk induk akan diterapkan ke semua anaknya, misalnya road.local dan road.highway.

Perhatikan, fitur induk dapat menyertakan beberapa elemen yang tidak disertakan dalam semua fitur anaknya.

Tersedia fitur-fitur berikut:

  • all (default) memilih semua fitur.
  • administrative memilih semua area administratif. Penataan gaya hanya memengaruhi label area administratif, bukan batas geografis atau isian.
    • administrative.country memilih negara.
    • administrative.land_parcel memilih persil tanah.
    • administrative.locality memilih lokalitas.
    • administrative.neighborhood memilih daerah sekitar.
    • administrative.province memilih provinsi.
  • landscape memilih semua lanskap.
    • landscape.man_made memilih bangunan yang dibuat oleh manusia.
    • landscape.natural memilih fitur alami.
    • landscape.natural.landcover memilih fitur penutup tanah.
    • landscape.natural.terrain memilih fitur medan.
  • poi memilih semua tempat menarik.
    • poi.attraction memilih daya tarik wisata.
    • poi.business memilih bisnis.
    • poi.government memilih gedung pemerintahan.
    • poi.medical memilih layanan darurat, termasuk rumah sakit, apotek, polisi, dokter, dan lainnya.
    • poi.park memilih taman.
    • poi.place_of_worship memilih tempat ibadah, termasuk gereja, kuil, mesjid, dan lainnya.
    • poi.school memilih sekolah.
    • poi.sports_complex memilih kompleks olahraga.
  • road memilih semua jalan.
    • road.arterial memilih jalan arteri.
    • road.highway memilih jalan raya.
    • road.highway.controlled_access memilih jalan raya dengan akses terkontrol.
    • road.local memilih jalan setempat.
  • transit memilih semua terminal angkutan umum dan jalurnya.
    • transit.line memilih jalur angkutan.
    • transit.station memilih semua terminal angkutan umum.
    • transit.station.airport memilih bandara.
    • transit.station.bus memilih halte bus.
    • transit.station.rail memilih stasiun kereta api.
  • water memilih badan air.

Elemen

Deklarasi style berikut mewarnai label untuk semua jalan lokal:

style=feature:road.local|element:labels|color:0xffffff

Elemen subdivisi fitur. Sebuah jalan, misalnya, terdiri dari garis grafik (geometri) pada peta, juga teks yang menunjukkan namanya (label).

Elemen berikut tersedia, namun perhatikan bahwa fitur tertentu mungkin tidak mendukung, mendukung sebagian, atau semua, elemen:

  • all (default) memilih semua elemen fitur yang ditetapkan.
  • geometry memilih semua elemen geometris fitur yang ditetapkan.
    • geometry.fill hanya memilih isian geometri fitur.
    • geometry.stroke hanya memilih garis luar geometri fitur.
  • labels memilih label tekstual yang dikaitkan dengan fitur yang ditetapkan.
    • labels.icon hanya memilih ikon yang ditampilkan dalam label fitur.
    • labels.text hanya memilih teks label.
    • labels.text.fill hanya memilih isian label. Isian label biasanya dirender sebagai garis luar berwarna yang mengelilingi teks label.
    • labels.text.stroke hanya memilih garis luar teks label.

Aturan gaya

Aturan gaya adalah opsi pemformatan yang diterapkan pada fitur dan elemen yang ditetapkan dalam setiap deklarasi style.

Deklarasi style berikut menerapkan dua aturan gaya untuk jalan pada peta. Aturan pertama menerapkan warna ke jalan. Aturan kedua menyederhanakan tampilan jalan, sehingga mereka memiliki garis tipis tanpa garis luar:

style=feature:road|color:0xffffff|visibility:simplified

Setiap deklarasi style harus berisi satu atau beberapa operasi yang dipisah menggunakan karakter pipa ("|"). Setiap operasi menetapkan nilai argumen menggunakan karakter titik dua (":"), dan semua operasi diterapkan sesuai urutan Anda menetapkannya.

Opsi gaya berikut telah didukung:

  • hue (string heksadesimal RGB dengan format 0xRRGGBB) menunjukkan warna dasar.

    Catatan: Opsi ini menyetel hue dengan mempertahankan saturation dan lightness yang ditetapkan dalam gaya default Google (atau dalam opsi gaya lainnya yang Anda definisikan pada peta). Warna yang dihasilkan relatif terhadap gaya peta dasar. Jika Google membuat perubahan pada gaya peta dasar, perubahan tersebut akan memengaruhi fitur peta Anda yang telah diberi gaya dengan hue. Lebih baik menggunakan styler color absolut jika bisa.

  • lightness (nilai titik-mengambang antara -100 dan 100) menunjukkan persentase perubahan kecerahan elemen. Nilai negatif menambah tingkat kegelapan (-100 menetapkan hitam) sementara nilai positif menambah tingkat kecerahan (+100 menetapkan putih).

    Catatan: Opsi ini menyetel lightness dengan mempertahankan saturation dan hue yang ditetapkan dalam gaya default Google (atau dalam opsi gaya lainnya yang Anda definisikan pada peta). Warna yang dihasilkan relatif terhadap gaya peta dasar. Jika Google membuat perubahan pada gaya peta dasar, perubahan tersebut akan memengaruhi fitur peta Anda yang telah diberi gaya dengan lightness. Lebih baik menggunakan styler color absolut jika bisa.

  • saturation (nilai titik-mengambang antara -100 dan 100) menunjukkan perubahan persentase intensitas warna dasar yang diterapkan pada elemen.

    Catatan: Opsi ini menyetel saturation dengan mempertahankan hue dan lightness yang ditetapkan dalam gaya default Google (atau dalam opsi gaya lainnya yang Anda definisikan pada peta). Warna yang dihasilkan relatif terhadap gaya peta dasar. Jika Google membuat perubahan pada gaya peta dasar, perubahan tersebut akan memengaruhi fitur peta Anda yang telah diberi gaya dengan saturation. Lebih baik menggunakan styler color absolut jika bisa.

  • gamma (nilai titik-mengambang antara 0.01 dan 10.0, dengan nilai 1.0 menyatakan tidak ada koreksi) menunjukkan besarnya koreksi gamma yang diterapkan pada elemen. Koreksi gamma memodifikasi kecerahan warna secara non-linier, walaupun tidak memengaruhi nilai-nilai hitam atau putih. Koreksi gamma biasanya digunakan untuk memodifikasi kontras beberapa elemen. Misalnya, Anda bisa memodifikasi gamma untuk menambah atau mengurangi kontras antara tepi dan bagian dalam elemen.

    Catatan: Opsi ini menyesuaikan kecerahan secara relatif terhadap gaya default Google, dengan menggunakan kurva gamma. Jika Google membuat perubahan pada gaya peta dasar, perubahan tersebut akan memengaruhi fitur peta Anda yang telah diberi gaya dengan gamma. Lebih baik menggunakan styler color absolut jika bisa.

  • invert_lightness (jika true) akan membalikkan kecerahan yang ada. Hal ini berguna, misalnya, saat beralih secara cepat ke peta yang lebih gelap dengan teks putih.

    Catatan: Opsi ini cuma membalikkan gaya default Google. Jika Google membuat perubahan pada gaya peta dasar, perubahan tersebut akan memengaruhi fitur peta Anda yang telah diberi gaya dengan invert_lightness. Lebih baik menggunakan styler color absolut jika bisa.

  • visibility (on, off, atau simplified) menunjukkan apakah elemen muncul pada peta, serta caranya. Visibilitas simplified membuang beberapa fitur gaya dari fitur yang terpengaruh; misalnya, jalan disederhanakan menjadi garis lebih tipis tanpa garis luar, sedangkan taman kehilangan teks labelnya namun mempertahankan ikon label.
  • color (string heksadesimal RGB dengan format 0xRRGGBB) menyetel warna fitur.
  • weight (nilai integer, lebih besar dari atau sama dengan nol) menyetel bobot fitur, dalam piksel. Setelan bobot ke nilai yang tinggi bisa mengakibatkan pemangkasan dekat batas petak.

Aturan gaya diterapkan sesuai urutan Anda menetapkannya. Jangan gabungkan beberapa operasi menjadi satu gaya. Sebagai gantinya, definisikan setiap operasi sebagai entri terpisah dalam larik gaya.

Catatan: Urutan penting, karena beberapa operasi tidak bersifat komutatif. Fitur dan/atau elemen yang dimodifikasi melalui operasi gaya (biasanya) sudah memiliki gaya. Operasi berfungsi pada gaya yang sudah ada tersebut, jika ada.

Model hue, saturation, lightness

Peta bergaya menggunakan model Hue, Saturation, Lightness (HSL) untuk menunjukkan warna dalam operasi styler. Hue menunjukkan warna dasar, saturation menunjukkan intensitas warna, dan lightness menunjukkan jumlah relatif putih atau hitam dalam warna konstituen.

Koreksi gamma akan memodifikasi lightness pada ruang warna, umumnya untuk menambah atau mengurangi kontras. Selain itu, model HSL mendefinisikan warna dalam ruang koordinat dengan hue menunjukkan orientasi dalam roda warna, sedangkan saturation dan lightness menunjukkan amplitudo di sepanjang sumbu yang berbeda. Hue diukur dalam ruang warna RGB, yang mirip dengan ruang warna RGB pada umumnya, hanya tidak ada bayangan putih dan hitam.

Model hue, saturation, lightness

Meskipun hue mengambil nilai warna heksadesimal HTML, hue hanya menggunakan nilai ini untuk menentukan warna dasar - yaitu, orientasinya di roda warna, bukan saturasi atau kecerahan, yang ditunjukkan secara terpisah sebagai perubahan persentase.

Misalnya, Anda bisa mendefinisikan hue untuk hijau murni berupa hue:0x00ff00 atau hue:0x000100. Kedua hue identik. Kedua nilai menunjuk ke hijau murni dalam model warna HSL.

Roda Warna RGB

Nilai hue RGB yang terdiri dari bagian seimbang merah, hijau dan biru tidak menunjukkan hue, karena tidak satu pun dari nilai tersebut yang menunjukkan orientasi di ruang koordinat HSL. Contohnya adalah "#000000" (hitam), "#FFFFFF" (putih), dan semua arsiran murni abu-abu. Untuk menunjukkan hitam, putih atau abu-abu, Anda harus membuang semua saturation (menyetel nilai ke -100) dan menyetel lightness sebagai gantinya.

Selain itu, saat memodifikasi fitur yang ada dan telah mempunyai skema warna, mengubah nilai seperti hue tidak akan mengubah saturation atau lightness yang ada.

Kirim masukan tentang...

Google Static Maps API
Butuh bantuan? Kunjungi halaman dukungan kami.