Google Maps Untuk Website: Mengenal Lebih Jauh

27 Oktober 2022

Bingung memilih peta yang tepat untuk website atau aplikasi Anda? Masih bingung perbedaan dari Peta Dinamis, Peta Statis dan Peta Embed? Google Maps dapat memberikan Anda berbagai pilihan untuk memilih peta dan Google tahu kalau hal itu mungkin sedikit memusingkan, untuk itu, Terralogiq akan memberikan penjelasan singkat mengenai masing-masing peta, yang kami harapkan dapat membantu Anda untuk membedakannya. 

Google Maps untuk website

Dinamic, Statik, Embed, Mana yang terbaik?

Untuk memilih maps yang cocok, Anda perlu mengetahui untuk tujuan serta service-nya. Ketika Anda ingin menunjukkan dimana lokasi bisnis Anda dengan penanda peta atau arah, mengetahui posisi asset anda secara real-time atau mengatur stile peta yang yang cocok untuk tampilan web page Anda, Anda perlu memastikan peta seperti apa yang tepat untuk hal tersebut. Terdapat beberapa point yang harus Anda pikirkan sebelum memilih salah satu map yang tepat untuk bisnis Anda:

  1. Apa tujuan bisnis Anda? – Apa yang ingin anda capai dengan map, bagaimana maps pega mendukung bisnis Anda?
  2. Siapa saja pengguna Anda?  – informasi seperti apa yang mereka harapkan dari Anda, apa yang akan mereka dapatkan?
  3. Apa tambahan informasi yang ingin Anda tampilkan di peta Anda – tambahkan custom layers dengan lokasi bisnis Anda, rute, point of service atau lain sebagainya?
  4. Service seperti apa yang dibutuhkan dengan peta Anda? – street view, geolocation, distance matrix, directions?
  5. Bagaimana Anda ingin menambahkan informasi tambahan? – seperti gambar, garis, custom icons, dan lain sebagainya?

Setelah memberikan jawaban untuk pertanyaan mengenai Google Maps Platform, Anda memiliki 4 tipe maps yang bisa Anda pilih:

  • Dynamic Map adalah objek yang interaktif. Pengguna bisa dengan mudah melihat tampilan layer pan, zoom atau switch. Sebuah website atau aplikasi biasa menampilkan maps dengan JavaScript. 
  • Static Map adalah sebuah gambar yang ditambahkan pada halaman website dengan HTML yang simpel. Tampilannya tidak interaktif, yang berarti Anda tidak melakukan panning, zooming ataupun mengubah layer maps.
  • Embed Advanced Map mengizinkan Anda untuk menampilkan frame interaktif dengan maps pada website Anda dengan HTML (menambahkan URL). kecuali untuk menandai tempat dengan pin, Anda Juga menunjukkannya dengan tampilan street view, routes, atau menambahkan kolom pencarian
  • Embed Map mengizinkan Anda untuk menempatkan peta interaktif pada website Anda dengan HTML (dengan menambahkan URL). Anda juga bisa menambahkan penanda simpel pada peta tersebut. 

Masing-masing peta tersebut dapat memberikan berbagai macam aktivitas yang bisa Anda tunjukkan dan pengalaman pengguna yang berbeda pada aplikasi atau website. Tabel berikut ini akan membandingkan keempat peta tersebut pada fitur-fitur utamanya. 

Tabel Perbandingan Peta Pada Google Maps

DynamicStaticEmbed AdvancedEmber

Displaying Simple View

YESYESYESYES
Marking Place On The Map
YESYESYESYES
Setting The Map Parameters
YESYESYESYES
Using Custom/Styled Markers
YESYESNONO
Using Styled Maps
YESYESNONO
Implementing The Event Listeners
YESNONONO
Displaying Info About The Place
YESNOYESYES
Placing Custom Layers On The Map
YESNONONO
Drawing Shapes On The Map
YESYESNONO
Finding Routes
YESYESNO
Placing More Than One Marker
YESYESNONO
Searching Place
YESNOYESNO
Using Street View
YESNOYESNO
Using Autocomplete Service
YESNONONO
Geolocation
YESNONONO
Type Of The Map
dynamic object on the websitestatic image on the websitedynamic iframe on the websitedynamic iframe on the website
Placing The Map On The Websiteimplementing and modifying the map object using javascript APIsending the HTTP request and receiving the image src parametersending the HTTP request and receiving the iframe src parametersending the HTTP request and receiving the iframe src parameter

Dynamic Maps

Seperti yang Anda ketahui, kebanyakan keuntungan menggunakan dynamic map dapat membantu Anda untuk melakukan berbagai macam hal dengan map Anda- anda bisa menambahkan objects dan layer, menggambar dipetanya, mengatur stylenya, menemukan rute, menambahkan penanda sebanyak yang anda inginkan, mencari tempat, menggunakan street view geolocate, menggunakan autocomplete. Anda juga perlu mengingat bahwa hanya dynamic maps yang bisa bekerja maksimal dengan semua Google Maps web services, misalnya geolocation. Dengan peta seperti ini, anda bisa mendapatkan lebih daripada yang anda harapkan. Inilah yang membuat dynamic map menjadi lebih populer dan seringkali digunakan. 

Pro:

  • Memiliki pengalaman interaktif – panning, zooming, mengubah layer
  • Mengatur style map dan penanda maps
  • Menambahkan custom layers
  • Menampilkan informasi mengenai POI
  • Memiliki opsi routing
  • Search mode dan service autocomplete

Contra: 

  • Membutuhkan skill developing –  Java Script
  • – Membutuhkan lebih banyak bandwidth 

Contoh penggunaan:

  • Aplikasi yang menunjukkan posisi kendaraan atau orang real time
  • Penanda store memudahkan untuk mencari lokasi dan informasi mengenai lokasi bisnis Anda serta menampilkan informasi untuk mencapai lokasinya
  • Website real estate perlu menunjukkan lokasi rumah/ apartemen yang sedang dijual beserta informasi mengenai lokasi sekitarnya, seperti toko, kantor fasilitas umum, sekolah dan lain sebagainya.
  • Website pemesanan penerbangan yang menampilkan berbagai macam pilihan untuk menghubungkan penerbangan yang sedang berjalan. 

Baca Juga: 9 Hal yang perlu diketahui tentang Google Maps Data

Static Map

Static Map masih memiliki banyak nilai untuk website Anda, karena Anda bisa mengatur stylenya, penanda penanda lokasi sekitar dengan menggambarnya. Tetapii, pengalaman penggunaanya terbatas, sehingga hal ini mungkin dapat berguna ketika Anda ingin pengguna Anda tidak terdistraksi dan tetap fokus dengan apa yang ingin Anda berikan. Misalnya, memberikan pelayanan yang baik untuk menunjukkan visualisasi lokasi secara akurat, seperti hotel, tempat parkir, dan menggambarkan bagaimana situasi di tempat tersebut. 

Pro: 

  • Mudah diimplementasikan – tidak perlu JavaScript
  • Tidak memakan banyak memori
  • Bisa dengan mudah mengatur style map dan marker
  • Menempatkan beberapa marker sekaligus
  • Menggambar pada peta secara langsung

Kontra: 

  • Tidak adanya interaksi pada peta – tidak ada zooming, panning, atau mengubah layers
  • Tidak ada pilihan routing
  • Tidak ada custom layers
  • Tidak ada POI info

Contoh penggunaan: 

  • Halaman website travel yang menunjukkan lokasi atau tempat turis terkenal 
  • Website reservasi hotel 

Embed Advanced dan Simpel Embed Maps

Cara termudah untuk menambahkan peta pada website Anda adalah dengan menambahkan set URL dan menambahkannya dalam bentuk kode HTML. Tidak perlu memasukan kode Javascript. Embed Advanced pun memiliki banyak penawaran untuk bisnis Anda – seperti street view, kolom pencarian dan memberikan pointer yang tepat pada maps seperti jarak dan waktu perjalanan. Simple embed map sangat direkomendasikan ketika Anda tidak memerlukan informasi tambahan lainnya selain lokasi tepatnya. 

Pro:

  • Pengalaman interaktif
  • Mudah diimplementasi – tidak perlu Javascript
  • Menampilkan informasi POI
  • Pada Embed Advanced, Anda bisa menampilkan mode street view dan route

Kontra: 

  • Tidak bisa kostum atau mengatur style
  • Tidak ada custom layer
  • Tidak bisa menggambar langsung di peta 
  • Hanya satu penanda yang bisa dimasukkan
  • Click on point mengarahkan pengguna langsung kepada website Google Maps (terbuka di tab baru)

Contoh penggunaan:

  • Menambahkan informasi pada kotak kontak informasi mengenai lokasi bisnis

Apabila Anda membutuhkan bantuan untuk memilih layanan Google Maps yang tepat untuk bisnis dan industri Anda. Anda bisa menghubungi Terralogiq untuk berkonsultasi. Terralogiq adalah Google Maps Premier Partner yang memiliki pengalaman selama 9 tahun serta memiliki lebih dari 150 klient dari berbagai industri.  Terralogiq akan memberikan solusi serta pelayanan terbaik untuk memajukan bisnis Anda menjadi lebih baik. Untuk informasi lebih lanjut Anda dapat menghubungi kami melalui link ini.

Author Profile

Nuritia Ramadhani

Content Manager

|

Share this post on

Related Article