Google Map is used in most of the apps which are used to represent many locations and markers on Google Maps. We have seen markers on Google maps for multiple locations. In this article, we will take a look at the implementation of Multiple Markers on Google Maps in Android.
What we are going to build in this article?
We will be building a simple application in which we will be displaying multiple markers on maps in different locations. A sample image is given below to get an idea about what we are going to do in this article. Note that we are going to implement this project using the Java language.
Step by Step Implementation
Step 1: Create a New Project
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Java as the programming language. Make sure to select Maps Activity while creating a new Project.
Step 2: Generating an API key for using Google Maps
To generate the API key for Maps you may refer to How to Generate API Key for Using Google Maps in Android. After generating your API key for Google Maps. We have to add this key to our Project. For adding this key in our app navigate to the values folder > google_maps_api.xml file and at line 23 you have to add your API key in the place of YOUR_API_KEY.
Step 3: Adding Multiple Markers to our Map
Go to the MapsActivity.java file and refer to the following code. Below is the code for the MapsActivity.java file. Comments are added inside the code to understand the code in more detail.
Java
import android.os.Bundle;import androidx.fragment.app.FragmentActivity;import com.google.android.gms.maps.CameraUpdateFactory;import com.google.android.gms.maps.GoogleMap;import com.google.android.gms.maps.OnMapReadyCallback;import com.google.android.gms.maps.SupportMapFragment;import com.google.android.gms.maps.model.LatLng;import com.google.android.gms.maps.model.MarkerOptions;import java.util.ArrayList;public class MapsActivity extends FragmentActivity implements OnMapReadyCallback { private GoogleMap mMap; // below are the latitude and longitude // of 4 different locations. LatLng sydney = new LatLng(-34, 151); LatLng TamWorth = new LatLng(-31.083332, 150.916672); LatLng NewCastle = new LatLng(-32.916668, 151.750000); LatLng Brisbane = new LatLng(-27.470125, 153.021072); // creating array list for adding all our locations. private ArrayList<LatLng> locationArrayList; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_maps); // Obtain the SupportMapFragment and get notified when the map is ready to be used. SupportMapFragment mapFragment = (SupportMapFragment) getSupportFragmentManager().findFragmentById(R.id.map); mapFragment.getMapAsync(this); // in below line we are initializing our array list. locationArrayList = new ArrayList<>(); // on below line we are adding our // locations in our array list. locationArrayList.add(sydney); locationArrayList.add(TamWorth); locationArrayList.add(NewCastle); locationArrayList.add(Brisbane); } /** * Manipulates the map once available. * This callback is triggered when the map is ready to be used. * This is where we can add markers or lines, add listeners or move the camera. In this case, * we just add a marker near Sydney, Australia. * If Google Play services is not installed on the device, the user will be prompted to install * it inside the SupportMapFragment. This method will only be triggered once the user has * installed Google Play services and returned to the app. */ @Override public void onMapReady(GoogleMap googleMap) { mMap = googleMap; // inside on map ready method // we will be displaying all our markers. // for adding markers we are running for loop and // inside that we are drawing marker on our map. for (int i = 0; i < locationArrayList.size(); i++) { // below line is use to add marker to each location of our array list. mMap.addMarker(new MarkerOptions().position(locationArrayList.get(i)).title("Marker")); // below line is use to zoom our camera on map. mMap.animateCamera(CameraUpdateFactory.zoomTo(18.0f)); // below line is use to move our camera to the specific location. mMap.moveCamera(CameraUpdateFactory.newLatLng(locationArrayList.get(i))); } }} |
After adding this code. Now run your app and see the output of the app.
Output:
Note: In the Google Developer Console (https://console.developers.google.com), ensure that the “Google Maps Android API v2” is enabled. And also ensure that your API Key exists.
