Infowindow上的Google Maps API v3錯誤

Question

請原諒我的英語，我是法語。

請在下面找到我在互聯網上找到的代碼。 我嘗試對其進行修改以實現功能：PlaceInfoBulle該功能在Marker上添加和InfoWindow。

我將在Excel中使用此代碼，並在通過vba執行此代碼時使用以下代碼：“ Gmaps.SearchLatLng（'我的地址'）;”

單擊標記的均勻性會產生錯誤。

            <html> 
            <head>
               <title>Code minimaliste pour afficher la carte de France grâce à google maps</title>
               <style type="text/css">
                  #carte_gmaps { width:600px; height:600px; margin:auto; }
               </style>
            </head>

            <body>
               <div id="carte_gmaps"></div>

               <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

            <script type="text/javascript">
            // Initialisation de variables
                   var Geocodeur;

                   var Gmaps = {    
                      Init : function(id, typeRendu, latCenter, lngCenter, zoom) {  
                         this.num=0;
                         this.marker = new Array();this.txtBulles=new Array();
                         this.icon, this.point, this.titleMk;

                         var myOptions = {
                            center: new google.maps.LatLng((latCenter ? latCenter : 46.86178015), (lngCenter ? lngCenter :  1.70158805)),
                            zoom: (zoom ? zoom : 6),
                            mapTypeId: (typeRendu ? typeRendu : 'roadmap')
                         }

                         this.map = new google.maps.Map(document.getElementById(id), myOptions);
                      },







                      // création d'un marqueur
                      CreateMarker : function(lat, lng) {
                         if(!this.map) {
                               alert('Erreur : Vérifier que la méthode Init a bien été appelé (ex : Gmaps.Init(\'id_carte_gmaps\');)');
                            return false;
                           }
                         this.point = new google.maps.LatLng(lat, lng);
                         this.PlaceMarker();
                      },

                      // Place le marqueur sur la carte et ajoute un événement click au besoin
                      PlaceMarker : function() {
                         this.marker[this.num] = new google.maps.Marker({
                            position: this.point,
                            map: this.map,
                            title:"test"
                         });
                        this.PlaceInfoBulle();

                      },


                      PlaceInfoBulle : function () {
                        var contentString = 'toto';
                        var infoBulle  = new google.maps.InfoWindow({
                            content: contentString
                        });
                        google.maps.event.addListener(this.marker[this.num], "click", function() {
                        this.infoBulle.open(this.map,this.marker[this.num]);
                        });

                        },





                      // Lance une recherche de latitude et longitude d'une adresse
                      SearchLatLng : function(adresse) {
                         Geocodeur = new google.maps.Geocoder(); 
                         Geocodeur.geocode({address: adresse}, Gmaps.GeocodeResult);
                      },    


                      // Analyse la réponse d'une recherche de latitude et longitude
                      GeocodeResult : function(response, status) {
                         var nbre_adresses = response.length;

                         if (status == google.maps.GeocoderStatus.OK && nbre_adresses) {
                            if(nbre_adresses>1) {
                               alert("Plusieurs adresses ont été trouvées...\nVérifiez que l'adresse est compléte et assez précise");
                            }
                            else {
                               Geocodeur.Item = response[0];

                               var lat = Geocodeur.Item.geometry.location.lat();
                               var lng = Geocodeur.Item.geometry.location.lng();
                               if(lat && lng) {
                                  Gmaps.CreateMarker(lat, lng); // Evidemment on indique bien les valeurs trouvés (latitude, longitude)
                                }
                            }                   
                         }
                         else if(status == google.maps.GeocoderStatus.ZERO_RESULTS)
                            alert("L\'adresse n\'a pas été trouvée...\nVeuillez vérifier la validité de votre adresse");
                         else
                            alert('Oups... Une erreur innatendue (oui je sais, une erreur n\'est jamais attendue ^^) est survenue, veuillez vérifier l\'adresse fournie svp.');
                      }
                   };


                   window.onload = function(){
                      Gmaps.Init('carte_gmaps');
                      //Gmaps.CreateMarker(50.7558629, 2.0617393); // ça c'était avant quand on avait pas notre système de géolocalisation :)
                      Gmaps.SearchLatLng('246 rue du communal, 62890, la wattine, FRANCE');
                   }
                 </script>

            </body>
            </html>

Answer 1

請試試這個

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript"  src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
  function initialize() {
    var position = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 10,
      center: position,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(
        document.getElementById("map_canvas"),
        myOptions);

    var marker = new google.maps.Marker({
        position: position,
        map: map,
        title:"This is the place."
    }); 

    var contentString = 'Hello <strong>World</strong>!';
    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });

    google.maps.event.addListener(marker, 'click', function() {
      infowindow.open(map,marker);
    });

  }

</script>
</head>
<body onload="initialize()">
  <div id="map_canvas" style="width:500px; height:500px"></div>
</body>
</html>

Infowindow上的Google Maps API v3錯誤

問題描述

1 個解決方案

解決方案1
0 2013-06-03 10:49:52

Infowindow上的Google Maps API v3錯誤

問題描述

1 個解決方案

解決方案1 0 2013-06-03 10:49:52

解決方案1
0 2013-06-03 10:49:52