Thursday, May 17, 2012

Create multi-marker OpenStreetMap for Android

A example to craete Android app using OpenStreetMap with multi-marker.

multi-marker OpenStreetMap on Android


AndroidOpenStreetMapViewActivity.java
package com.exercise.OpenStreetMapView;

import java.util.ArrayList;
import org.osmdroid.util.GeoPoint;
import org.osmdroid.views.MapController;
import org.osmdroid.views.MapView;
import org.osmdroid.views.overlay.ItemizedIconOverlay;
import org.osmdroid.views.overlay.OverlayItem;
import org.osmdroid.views.overlay.ScaleBarOverlay;

import android.app.Activity;
import android.os.Bundle;

public class AndroidOpenStreetMapViewActivity extends Activity {
 
 private MapView myOpenMapView;
 private MapController myMapController;
 
 ArrayList<OverlayItem> anotherOverlayItemArray;
 
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        myOpenMapView = (MapView)findViewById(R.id.openmapview);
        myOpenMapView.setBuiltInZoomControls(true);
        myMapController = myOpenMapView.getController();
        myMapController.setZoom(2);
      
        //--- Create Another Overlay for multi marker
        anotherOverlayItemArray = new ArrayList<OverlayItem>();
        anotherOverlayItemArray.add(new OverlayItem(
          "0, 0", "0, 0", new GeoPoint(0, 0)));
        anotherOverlayItemArray.add(new OverlayItem(
          "US", "US", new GeoPoint(38.883333, -77.016667)));
        anotherOverlayItemArray.add(new OverlayItem(
          "China", "China", new GeoPoint(39.916667, 116.383333)));
        anotherOverlayItemArray.add(new OverlayItem(
          "United Kingdom", "United Kingdom", new GeoPoint(51.5, -0.116667)));
        anotherOverlayItemArray.add(new OverlayItem(
          "Germany", "Germany", new GeoPoint(52.516667, 13.383333)));
        anotherOverlayItemArray.add(new OverlayItem(
          "Korea", "Korea", new GeoPoint(38.316667, 127.233333)));
        anotherOverlayItemArray.add(new OverlayItem(
          "India", "India", new GeoPoint(28.613333, 77.208333)));
        anotherOverlayItemArray.add(new OverlayItem(
          "Russia", "Russia", new GeoPoint(55.75, 37.616667)));
        anotherOverlayItemArray.add(new OverlayItem(
          "France", "France", new GeoPoint(48.856667, 2.350833)));
        anotherOverlayItemArray.add(new OverlayItem(
          "Canada", "Canada", new GeoPoint(45.4, -75.666667)));
        
        ItemizedIconOverlay<OverlayItem> anotherItemizedIconOverlay 
         = new ItemizedIconOverlay<OverlayItem>(
           this, anotherOverlayItemArray, null);
        myOpenMapView.getOverlays().add(anotherItemizedIconOverlay);
        //---
        
        //Add Scale Bar
        ScaleBarOverlay myScaleBarOverlay = new ScaleBarOverlay(this);
        myOpenMapView.getOverlays().add(myScaleBarOverlay);
    }
    
}

main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/hello" />
 <org.osmdroid.views.MapView
     android:id="@+id/openmapview"
     android:layout_width="fill_parent"
        android:layout_height="fill_parent"/>
     
</LinearLayout>

Permission needed in AndroidManifest.xml
  • android.permission.ACCESS_NETWORK_STATE
  • android.permission.INTERNET
  • android.permission.WRITE_EXTERNAL_STORAGE
  • android.permission.ACCESS_FINE_LOCATION


Download the files.

Related:
- Prepare Java Build Path to osmdroid and slf4j-android libs for OpenStreetMapView
- Display current location marker on OpenStreetMap

Next:
- Implement OnItemGestureListener on OpenStreetMap to detect user touch and retrieve touched items properties


4 comments:

Romit Amgai said...

the scale bar code stops the application, what is the alternative?

Paulo Vianna, the MusicGamer said...

Thanks. Very nice and simple tutorial!

Paulo Vianna, the MusicGamer said...

You can put infowindow and click? Thanks.

Unknown said...

how to plot markers on tap to screen?