Google Map Android API

Setelah pada posting sebelumnya dibahas tentang Google map API javascript yang dipakai di web. Sekarang akan dibahas tetang penggunaan google map di device android.

Pertama masuk ke google developer console. Aktifkan api service google map android API v2

Kemudian create android key.

Create new android project dari IDE kita.

Tambahkan meta data berikut ke dalam AndroidManifest.xml di dalam tag <application>

 <meta-data  
   android:name="com.google.android.gms.version"  
   android:value="@integer/google_play_services_version" />  
 <meta-data  
   android:name="com.google.android.maps.v2.API_KEY"  
   android:value="YOUR_API_KEY"/>  

Tambahkan uses-permission berikut ini AndroidManifest.xml

 <uses-permission android:name="android.permission.INTERNET"/>  
 <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>  
 <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>  
 <uses-permission android:name="com.google.android.providers.gsf.permission.READ_GSERVICES"/>  
 <!-- The following two permissions are not required to use  
    Google Maps Android API v2, but are recommended. -->  
 <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>  
 <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>  

Kemudian create library Google Play Service.

Caranya import project dari android sdk : <android-sdk>/extras/google/google_play_services/libproject/google-play-services_lib/



Di propertiesnya check as Library

Di project tadi ditambahkan library Google play service yang sudah kita buat ini.

Create android layout xml untuk menampung map.

 <?xml version="1.0" encoding="utf-8"?>  
 <fragment xmlns:android="http://schemas.android.com/apk/res/android"  
         xmlns:map="http://schemas.android.com/apk/res-auto"       
      android:id="@+id/map"  
      android:layout_width="match_parent"  
      android:layout_height="match_parent"  
      android:name="com.google.android.gms.maps.MapFragment"  
      />  

Panggil layout xml di java code Activity.

 @Override  
      protected void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           setContentView(R.layout.fragment_map);  
      }  

Run android application, maka tampilannya kurang lebih seperti ini :

Beberapa contoh penggunaan android google map api :

1. Menampilkan Marker

Untuk menampilkan market digunakan class Marker.

Marker diAdd ke object map

 Marker marker = map.addMarker(new MarkerOptions()  
                     .position(LAT_LNG)  
                     .title("your base")  
                     );  

Position marker diset berdasarkan latitude longitude yang diinginkan

 public class SampleMap extends Activity {  
      private static final LatLng LAT_LNG = new LatLng(-6.175486, 106.825407);  
      private GoogleMap map;  
      private Marker marker;  
      @Override  
      protected void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           setContentView(R.layout.fragment_map);  
           map = ((MapFragment) getFragmentManager().findFragmentById(R.id.map)).getMap();  
           map.animateCamera(CameraUpdateFactory.newLatLngZoom(LAT_LNG, 15));  
           Marker marker = map.addMarker(new MarkerOptions()  
                     .position(LAT_LNG)  
                     .title("your base")  
                     );  
      }  

2. Action Event

Google map api menyediakan beberapa class untuk melakukan event interaksi dengan map.
Antara lain : setOnMapLongClickListener(), setOnMapClickListener(), setOnCameraChangeListener(), OnMyLocationButtonClickListener().

Contohnya : Event OnMapClickListener(), dijalankan saat map diklik atau ditouch. Event ini mengalikan nilai koordinat latititude longitude yg bisa kita olah nantinya.
Pada contoh kali ini pada saat map diklik akan muncul message berupa koordinat dimana area tesebut diklik.

 public class SampleMap extends Activity {  
      private static final LatLng LAT_LNG = new LatLng(-6.175486, 106.825407);  
      private GoogleMap map;  
      private Marker marker;  
      @Override  
      protected void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           setContentView(R.layout.fragment_map);  
           map = ((MapFragment) getFragmentManager().findFragmentById(R.id.map)).getMap();  
           map.animateCamera(CameraUpdateFactory.newLatLngZoom(LAT_LNG, 15));  
           map.setOnMapClickListener(new GoogleMap.OnMapClickListener() {  
                @Override  
                public void onMapClick(LatLng arg) {  
                showToastMessage("lat : "+arg.latitude+"\nlng : "+arg.longitude);  
                }  
           });  
      }  
      public void showToastMessage(String message){  
           Toast.makeText(this, message, Toast.LENGTH_LONG).show();  
      }  

3. Menampilkan InfoWindow

Info window merupakan semacam popup yg muncul di map. Isinya bebas diisi content apa saja.

Untuk mengisi InfoWindow digunakan method snippet(), yang ada di Marker Option.

 map.addMarker(new MarkerOptions()  
           .position(position)  
           .title(title)  
           .snippet("CONTENT”)  
           );  

Untuk menampilkan InfoWindow panggil method showInfoWindow()

 public class SampleMap extends Activity {  
      private static final LatLng LAT_LNG = new LatLng(-6.175486, 106.825407);  
      private GoogleMap map;  
      private Marker marker;  
      @Override  
      protected void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           setContentView(R.layout.fragment_map);  
           map = ((MapFragment) getFragmentManager().findFragmentById(R.id.map)).getMap();  
           map.animateCamera(CameraUpdateFactory.newLatLngZoom(LAT_LNG, 15));  
           map.setOnMapClickListener(new GoogleMap.OnMapClickListener() {  
                @Override  
                public void onMapClick(LatLng arg) {  
                     showMarkerAndInfoWindow("you are here", arg);  
                                    }  
           });  
      }  
      public void showMarkerAndInfoWindow( String title, LatLng position){  
           if(marker!=null){  
                marker.remove();  
                marker = null;  
           }  
           marker = map.addMarker(new MarkerOptions()  
           .position(position)  
           .title(title)  
           .snippet("you are in : \nlat : "+position.latitude+"\nlng : "+position.longitude)  
           );  
           marker.showInfoWindow();  
      }  

Pada contoh ini infoWindow akan dimunculkan pada saat map diklik. Kemudian akan muncul marker dengan infoWindow di atas marker berisi informasi koordinat dimana titik itu diklik.

Demikian sedikit tutorial tentang google map api di Android, semoga bisa membantu.
Selamat mencoba.

Terima kasih :)