Untuk selanjutnya kita akan membuat aplikasi sederhana yang menggunakan fasilitas Google maps ataupun Apple maps, yaitu aplikasi yang berisikan map dan annotation. Pada tutorial aplikasi berikut ini akan menjelaskan langkah-langkah untuk menampilkan koordinat lokasi yang kita inginkan berdasarkan latitude dan longitude pada peta.

1. Membuat project mobile app classic seperti pada langkah-langkah sebelumnya, hingga siap untuk memulai penulisan kode program pada file app.js

 

2. Sebelum memulai penulisan kode program, kita harus melakukan installasi maps module (line 72 – 75) dan menambahkan baris kode untuk mengakses google maps pada Android  (line 42 – 62) dengan cara melakukan kofigurasi pada file tiapp.xml sperti gambar di bawah ini :

 

3. Untuk mendapatkan dan memasukkan API key google maps yang akan digunakan untuk menjalankan aplikasi maps pada Android yaitu dengan mengikuti langkah-langkah pada link berikut ini : Obtain Google maps API key, sedangkan untuk iOS sendiri dengan menambahkan konfigurasi installasi module maps seperti kode program di atas (line 74).

 

4. setelah konfigurasi sudah selesai, maka dapat dimulai untuk penulisan kode program berikut ini :

 

6. Kemudian jalankan hasil program di atas, sehingga akan terlihat tampilan pada simulator iOS dan Android (Geny motion nexus 4- 4.2.2) seperti di bawah ini :

Screen Shot 2014-07-17 at 9.46.18 AM     Screen Shot 2014-07-17 at 10.06.30 AM

7. Selesai lah project untuk membuat tampilan mapView dengan menggunakan annotation, jika ada pertanyaan atau pun masalah pada saat melakukan konfigurasi API key untuk Android apps dapat langsung diskusi melalui comment di bawah ini.

Untuk selanjutnya kita akan membahas mengenai penjelasan Geo location dan implementasinya pada sub bab berikutnya.

Cara membuat map view dan map annotation
Tagged on: