Sebagai lanjutan dari post sebelumnya yaitu Membuat Aplikasi Google Map Kita Sendiri. Di sini akan dilanjutkan membuat tutorial tentang menambahkan marker dan mencoba dialog. Langsung aja deh 😉
Sebelumnya siapkan eclipse dan emulatornya.
Tambahkan file CustomItemizedOverlay.java pada package com.iddev.googlemap :
package com.iddev.googlemap;
import java.util.ArrayList;
import android.graphics.drawable.Drawable;
import com.google.android.maps.ItemizedOverlay;
import com.google.android.maps.OverlayItem;
public class CustomItemizedOverlay extends ItemizedOverlay {
private ArrayList<OverlayItem> mOverlays = new ArrayList<OverlayItem>();
private MainActivity mainActivity;
public CustomItemizedOverlay(Drawable defaultMarker) {
super(boundCenterBottom(defaultMarker));
}
public CustomItemizedOverlay(Drawable defaultMarker, MainActivity mainActivity) {
super(boundCenterBottom(defaultMarker));
this.mainActivity = mainActivity;
}
public void addOverlay(OverlayItem overlay) {
mOverlays.add(overlay);
populate();
}
@Override
protected OverlayItem createItem(int i) {
return mOverlays.get(i);
}
@Override
public int size() {
return mOverlays.size();
}
@Override
protected boolean onTap(int index) {
OverlayItem item = mOverlays.get(index);
return true;
}
}
Jika sudah, sekarang kita unduh dulu markernya dari sini. Kemudian extract dan masukan salah satu saja, misalnya bank.png. Cukup copy-paste ke dalam folder drawable yang ada di dalam folder res.
marker bank
Oke, sekarang kita tambahkan beberapa coding sehingga pada MainActivity.java berubah menjadi seperti ini :
package com.iddev.googlemap;
import java.util.List;
import com.google.android.maps.GeoPoint;
import com.google.android.maps.MapActivity;
import com.google.android.maps.MapController;
import com.google.android.maps.MapView;
import com.google.android.maps.Overlay;
import com.google.android.maps.OverlayItem;
import android.content.Intent;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuInflater;
import android.view.MenuItem;
import android.view.Window;
public class MainActivity extends MapActivity {
public MapView mapView;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.main);
mapView = (MapView) findViewById(R.id.mapview);
mapView.setBuiltInZoomControls(true);
// set posisi tengah dari map
MapController mapController = mapView.getController();
mapController.setCenter(new GeoPoint(-7298115, 112739451));
mapController.setZoom(12);
List<Overlay> mapOverlays = mapView.getOverlays();
Drawable drawable = this.getResources().getDrawable(R.drawable.bank);
CustomItemizedOverlay itemizedoverlay = new CustomItemizedOverlay(drawable);
GeoPoint point = new GeoPoint(-7298115, 112739451);
OverlayItem overlayitem = new OverlayItem(point, "Ini adalah Judul", "Ini adalah keterangan");
itemizedoverlay.addOverlay(overlayitem);
mapOverlays.add(itemizedoverlay);
}
@Override
protected boolean isRouteDisplayed() {
return false;
}
}
Sekarang kita jalankan dengan emulatornya.
hasil akhir
Sudah jadi kan 🙂
Sekarang akan saya jelaskan maksud dari coding di atas untuk penambahan marker.
List<Overlay> mapOverlays = mapView.getOverlays();
Digunakan untuk mengambil seluruh overlay yang ada pada google map. Apaan sih overlay itu ? Overlay itu semacam layer atau tumpukan di atas peta google map. Overlay bisa berbagai macam jenis, antara lain polyline, polygon, marker.
Drawable drawable = this.getResources().getDrawable(R.drawable.bank);
Kode ini digunakan untuk mengubah alamat pointer dari file bank.png menjadi tipe drawable. Karena tipe drawable merupakan class yang bisa digambar di aplikasi. Intinya me-load file tersebut.
CustomItemizedOverlay itemizedoverlay = new CustomItemizedOverlay(drawable);
melakukan inisialisasi itemizedOverlay, di sini gambar bank tadi dimasukkan ke dalam objek CustomItemizedOverlay yang kita buat. Class CustomItemizedOverlay digunakan agar objek dapat masuk ke dalam overlay-nya google map.
GeoPoint point = new GeoPoint(-7298115, 112739451);
Nah, kalo ini sudah pasti kita tahu kalau ini menentukan posisi dari marker untuk berada di Surabaya. 🙂
OverlayItem overlayitem = new OverlayItem(point, “Ini adalah Judul”, “Ini adalah keterangan”);
Kalo ini mendefinisikan bahwa variabel point tadi dimasukkan ke dalam overlayitem, sehingga isi dari overlay item adalah lokasi, judul, dan keterangan.
itemizedoverlay.addOverlay(overlayitem);
Ini apaan sih ? nggak, kita cuma memasukkan overlayitem ke dalam itemizedoverlay. Jadi yang awalnya itemizedoverlay cuma memiliki marker di dalamnya, kini memiliki koordinat lintang dan bujur (longitude & latitude).
mapOverlays.add(itemizedoverlay);
Nah, ini yang penting. itemizedoverlay merupakan sebuah marker, jadi kalo ingin memasukkan ke dalam google map, tinggal menambahkannya ke dalam mapOverlay.
ID - Dev 