IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

APIs Google Discussion :

Ajouter des infos bulles


Sujet :

APIs Google

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Janvier 2004
    Messages
    143
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2004
    Messages : 143
    Par défaut Ajouter des infos bulles
    Bonjour et bonne année
    dans le code ci dessous je génére un liste de marker via un tableau en php
    tout roule par contre je voudrais ajouté 2 choses et mes connaissance en JS sont peu limiter
    1 ajouter une infobulle différentes pour chaques marqueurs ( j'ai une idée pour la partie php mais je trouve pas ou mettre ma boucle pour les infos bulles)
    2 utiliser la fonction groupe de markeur quand il y en trop dans la même zone ..
    Merci d'avance pour votre aide
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
     <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false?key=<?php echo $apikey; ?>"></script>
    <script type="text/javascript">
     
       /* Déclaration du centre de la map */ 
       var latlng = new google.maps.LatLng(<?php echo $mapcenter; ?>); // initialize view
     
       /* Déclaration de l'objet qui définira les limites de la map */ 
       var bounds = new google.maps.LatLngBounds();
     
       /* Déclaration et remplissage du tableau qui contiendra nos points, objets LatLng. */
       var myPoints = [];
        <?php
        //Recuperation de point de ma bdd
        foreach ($itemsLoc as $itemLoc){
            $coord = unserialize ($itemLoc->value);
            $lat = $coord['lat'];
            $lon = $coord['lon'];
            $coord = $lat.",".$lon;
            echo "myPoints.push( new google.maps.LatLng(". $coord .")); \r\n";
        }
        ?>
     
       /* Déclaration des options de la map */ 
       var options = {
        /*zoom : 7,
        center: latlng, */
        //  ici, ces 2 valeurs ne sont plus utiles car calculées automatiquement
        mapTypeId: google.maps.MapTypeId.<?php echo $maptype; ?>
       }
     
       /* Ici, nous déclarons l'élément html ayant pour id "map" comme conteneur de la map */
       var myDiv = document.getElementById('map');
     
       /* Chargement de la carte avec un type ROADMAP */
       var map = new google.maps.Map(myDiv,options);
     
       /* Boucle sur les points afin d'ajouter les markers à la map
       et aussi d'étendre ses limites (bounds) grâce à la méthode extend */ 
       for(var i = 0; i < myPoints.length; i++){
        bounds.extend(myPoints[i]);
        var thisMarker = addThisMarker(myPoints[i],i);
        thisMarker.setMap(map);
       }
     
       /* Ici, on ajuste le zoom de la map en fonction des limites  */ 
       map.fitBounds(bounds);
     
       /* Fonction qui affiche un marker sur la carte */ 
       function addThisMarker(point,m){
        var marker = new google.maps.Marker({position: point});
           /*TODO ADD CLUSTER PINT SYSTEM*/
        return marker;
       }         
     
    </script>

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    Bonjour,
    as tu été faire un tour sur la FAQ API Google Maps ?

  3. #3
    Membre confirmé
    Profil pro
    Inscrit en
    Janvier 2004
    Messages
    143
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2004
    Messages : 143
    Par défaut
    j'ai regardé, utilisé le code donnée n'est pas trop dur par contre ... j'ai du mal à l'intégrer dans la boucle ..
    j'ai l'impression que c'est à intégrer dans le code ci-dessous ... mais je n'y arrive pas j'ai tout faux ?
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     /* Fonction qui affiche un marker sur la carte */ 
       function addThisMarker(point,m){
        var marker = new google.maps.Marker({position: point});
           /*TODO ADD CLUSTER PINT SYSTEM*/
        return marker;
       }

  4. #4
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    1 ajouter une infobulle différentes pour chaques marqueurs
    c'est effectivement dans la fonction addThisMarker que tu dois prendre en compte la création de ton infoWindow sur le click du marqueur.

Discussions similaires

  1. Type des infos-bulles de la barre de notification
    Par Sunchaser dans le forum C++Builder
    Réponses: 23
    Dernier message: 25/08/2006, 20h00
  2. faire des info-bulle
    Par pafi76 dans le forum Access
    Réponses: 3
    Dernier message: 30/06/2006, 11h34
  3. Réponses: 2
    Dernier message: 20/02/2006, 16h06
  4. Créer des "infos bulles"
    Par Nanoulov dans le forum SWT/JFace
    Réponses: 6
    Dernier message: 08/07/2005, 15h02
  5. Réponses: 3
    Dernier message: 11/03/2004, 16h11

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo