web-dev-qa-db-fra.com

Comment gérer plusieurs marqueurs sur Google Maps avec le même emplacement?

J'utilise Google Maps dans une application et il est probable que plusieurs marqueurs soient attachés au même endroit, chaque marqueur représentant une personne. Dans cette situation, l'utilisateur ne saura pas qu'il y a d'autres marqueurs/personnes derrière ce marqueur.

J'ai regardé autour de moi pour gérer cette situation et une question sur SO suggère que je puisse afficher un seul marqueur et associer toutes les personnes à ce seul marqueur. Lorsque l'utilisateur appuie sur ce marqueur, je dois afficher une liste de tous les utilisateurs associés à ce marqueur. C'est une bonne solution de contournement, mais je voudrais éviter d'afficher une vue qui masque principalement Google Maps.

Quelqu'un at-il utilisé une solution de contournement dans une situation similaire?

androidiosobjective-cgoogle-mapsgoogle-maps-markers
16
Geek

La solution que j’ai utilisée est d’afficher des repères avec le même emplacement un peu à l’écart sur la carte pour que l’utilisateur ait une petite idée du repère multiple.

Je garde une trace des marqueurs sur la carte et de leurs emplacements sur la carte, et chaque fois que je veux ajouter un marqueur sur la carte, je veille à ce qu'aucun autre marqueur ne soit affiché au même emplacement. Si oui, alors j'ajoute un décalage à l'emplacement du nouveau marqueur que je veux ajouter.

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

La méthode ci-dessous renvoie l'emplacement à utiliser pour le nouveau marqueur. Cette méthode prend comme paramètres les nouvelles latitude et longitude actuelles du marqueur.

// 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));
}

Dans le code ci-dessus, markerLocation est un HashMap. 

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

Cette réponse a un code pour Android mais la même logique s'applique dans iOS.

14
Geek

Peut-être devriez-vous jeter un coup d'œil à la mise en cluster des marqueurs. C'est une solution courante pour afficher plusieurs marqueurs au même endroit. Article Google à ce sujet: https://developers.google.com/maps/articles/toomanymarkers

Il existe également des bibliothèques pour le faire, par exemple:

1
hunyadym

Donner un décalage éloignera les repères lorsque l'utilisateur effectuera un zoom avant au maximum. J'ai donc trouvé un moyen d'y parvenir. ce n'est peut-être pas une bonne façon mais cela a très bien fonctionné.

for loop markers
{
 //create marker
 let mapMarker = GMSMarker()
 mapMarker.groundAnchor = CGPosition(0.5, 0.5)
 mapMarker.position = //set the CLLocation
 //instead of setting marker.icon set the iconView
 let image:UIIMage = UIIMage:init(named:"filename")
 let imageView:UIImageView = UIImageView.init(frame:rect(0,0, ((image.width/2 * markerIndex) + image.width), image.height))
 imageView.contentMode = .Right
 imageView.image = image
 mapMarker.iconView = imageView
 mapMarker.map = mapView
}

définissez le zIndex du marqueur de manière à ce que l'icône du marqueur que vous souhaitez voir apparaisse au-dessus, sinon les animateurs seront animés comme une permutation automatique. lorsque l'utilisateur appuie sur le marqueur pour gérer le zIndex pour amener le marqueur. sur le dessus en utilisant zIndex Swap.

0
Satheesh G

Vous pouvez gérer l'événement de clic du marqueur (unique) et l'utiliser pour mettre à jour un élément situé en dehors du canevas Google Map avec les détails relatifs aux personnes se trouvant à ce marqueur.

0
Tim Ebenezer