Google Maps Javascript Api. Marqueurs de la carte infoWindow

Question

J'ai écrit un script pour afficher plusieurs marqueurs de carte avec la recherche par code postal, ou adresse pour afficher la distance entre les marqueurs multiples et l'emplacement donné de l'utilisateur mais .. je veux afficher infoWindow avec du contenu que je vais écrire à chacun des marqueurs ... Quelqu'un peut-il m'aider ??

Le script va comme ceci:

var features = [ 
     { 
     position: new google.maps.LatLng(38.089374, 23.809245), 
     type: 'info' 

     }, { 
     position: new google.maps.LatLng(37.865212, 23.744748), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.997172, 23.693429), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.934769, 23.879542), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(38.003720, 23.886767), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(38.027083, 23.850951), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.944077, 23.661457), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(38.017348, 23.796585), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.955754, 23.677229), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.971261, 23.756350), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.990022, 23.720621), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(38.050031, 23.752440), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(38.464754,23.615317), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(37.943692, 23.748214), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(39.544696, 21.775843), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(40.668344, 22.889161), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(40.662039, 22.911951), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(40.573629, 23.025070), 
     type: 'info' 
     }, { 
     position: new google.maps.LatLng(40.303271, 21.804128), 
     type: 'info' 
     } 

    ]; 



    // edw oi kaloi oi markers. 
    features.forEach(function(feature) { 
     var marker = new google.maps.Marker({ 
     position: feature.position, 
     icon: icons[feature.type].icon, 

     map: map 
     }); 



    }); 

Answer 1

quelque chose comme ça! Je ne suis pas un expert bien que selon votre question je partage la manière dont je pense que je l'aurais fait.

S'il vous plaît noter que je n'ai pas testé le code alors s'il vous plaît vérifiez et s'il y a un problème faites le moi savoir.

 var markers = [ 
     { 
      lat: 38.089374, 
      lng: 23.809245, 
      type: 'info' 

     }, { 
      lat: 40.668344, 
      lng: 22.889161, 
      type: 'info' 
     }, { 
      lat: 40.573629, 
      lng: 21.804128, 
      type: 'info' 
     }]; 
     var bounds = new google.maps.LatLngBounds(); 
     var mapOptions = { 
     mapTypeId: google.maps.MapTypeId.TERRAIN, 
     mapTypeControl: false, 
     fullscreenControl: false, 
     streetViewControl: false, 
     zoomControl: true, 
     }; 
     var mapDiv = document.getElementById('mapdiv'); 
     var map = new google.maps.Map(mapDiv, mapOptions); 
     var location; 
     if(markers.length > 0){ 
      for(var i=0; i<markers.length; i++){ 
       location = new google.maps.LatLng(markers[i].lat, markers[i].lng 
     ); 
     bounds.extend(location); 
     var marker = new google.maps.Marker({ 
         position: location, 
         map: map, 
         animation: google.maps.Animation.DROP, 
        }); 
     var content = '<div class="someclass">Your content goes here.</div>'; 
     var infowindow = new google.maps.InfoWindow({maxWidth:350}); 

     google.maps.event.addListener(marker, 'mouseover' ,(function(marker,content,infowindow) { 
       return function() { 
        infowindow.setContent(content); 
        infowindow.open(map, marker); 
       }; 
     }) (marker,content,infowindow)); 
    } 
} 

Enfin, si cela vous aide à résoudre votre problème, n'oubliez pas de l'accepter.