How to handle multiple markers on Google Maps with same location?

Geek picture Geek · Oct 31, 2013 · Viewed 22.6k times · Source

I use Google Maps in an app and it is likely that multiple markers are attached to same location where each marker represent a person. In this situation user will not know that there are other markers/persons behind this particular marker.

I looked around to handle this situation and one question on SO suggests that I can display a single marker and associate all persons with that single marker. When user taps that marker I should display a list of all the user associated with that marker. This is a good workaround but I would want to avoid displaying a view that mostly hides Google Maps.

Has anyone used any workaround in similar situation?

Answer

Geek picture Geek · Nov 13, 2013

Workaround I used is to display markers with same location little bit apart on map so that user gets a slight idea of multiple marker.

I keep track of markers on map and their locations on map, and whenever I want to add a marker on map I make sure that no other marker is displayed on same location. If yes, then I add an offset to location of new marker that I want to add.

static final float COORDINATE_OFFSET = 0.00002f; // You can change this value according to your need

Below method returns the location that has to be used for new marker. This method takes as parameters new marker's current latitude and longitude.

// Check if any marker is displayed on given coordinate. If yes then decide
// another appropriate coordinate to display this marker. It returns an
// array with latitude(at index 0) and longitude(at index 1).
private String[] coordinateForMarker(float latitude, float longitude) {

    String[] location = new String[2];

    for (int i = 0; i <= MAX_NUMBER_OF_MARKERS; i++) {

        if (mapAlreadyHasMarkerForLocation((latitude + i
                * COORDINATE_OFFSET)
                + "," + (longitude + i * COORDINATE_OFFSET))) {

            // If i = 0 then below if condition is same as upper one. Hence, no need to execute below if condition.
            if (i == 0)
                continue;

            if (mapAlreadyHasMarkerForLocation((latitude - i
                    * COORDINATE_OFFSET)
                    + "," + (longitude - i * COORDINATE_OFFSET))) {

                continue;

            } else {
                location[0] = latitude - (i * COORDINATE_OFFSET) + "";
                location[1] = longitude - (i * COORDINATE_OFFSET) + "";
                break;
            }

        } else {
            location[0] = latitude + (i * COORDINATE_OFFSET) + "";
            location[1] = longitude + (i * COORDINATE_OFFSET) + "";
            break;
        }
    }

    return location;
}

// Return whether marker with same location is already on map
private boolean mapAlreadyHasMarkerForLocation(String location) {
    return (markerLocation.containsValue(location));
}

In above code, markerLocation is a HashMap.

HashMap<String, String> markerLocation;    // HashMap of marker identifier and its location as a string

This answer has code for android but same logic applies in iOS.