Google Maps v3 - Les marqueurs ne s'affichent pas

La raison pour laquelle les marqueurs ne s'affinent pas sont parce que la partie du code est exécutée avant l'événement de charge est tiré et la méthode d'initialisation est invoquée - à ce stade, votre variable de carte est déjà créée. mais est toujours nul.

Essayez d'ajouter le code pour ajouter les marqueurs à l'intérieur de la méthode d'initialisation xxx

Voir ce jsfiddle ici où les marqueurs montrent http://jsfiddle.net/kvugb/

J'utilise ce code. J'espère que cela vous aide:

(function() {

window.onload = function() {

    // Creating a new map
    var map = new google.maps.Map(document.getElementById("map"), {
      center: new google.maps.LatLng(41.056466, -85.3312009),
      disableDefaultUI: false,
      zoom: 16,
      mapTypeId: google.maps.MapTypeId.SATELLITE
    });


    // Creating the JSON data
    var json = [
        {
            "title": "Title 1",
            "lat": 41.057814980291,
            "lng": -85.329851919709,
            "description": ""
        },
        {
            "title": "Title 2",
            "lat": 41.057814981000,
            "lng": -85.8048,
            "description": ""
        },
    ]

    var styles = [
  {
   "featureType": "water",
   "elementType": "geometry.fill",
   "stylers": [
      { "visibility": "on" },
      { "color": "#0077bb" },
  { "lightness": 70 }
      ]
      },{
      "featureType": "landscape.natural",
      "elementType": "geometry.fill",
      "stylers": [
      { "visibility": "on" },
      { "saturation": -100 },
      { "color": "#699e6b" },
      { "lightness": 76 }
      ]
      },{
      "featureType": "poi.park",
      "elementType": "geometry.fill",
      "stylers": [
      { "visibility": "off" }
      ]
      },{
      "featureType": "road.local",
      "elementType": "geometry.fill",
      "stylers": [
      { "visibility": "on" },
      { "color": "#ffffff" }
      ]
      }
      ];

       map.setOptions({styles: styles});



    // Creating a global infoWindow object that will be reused by all markers
    var infoWindow = new google.maps.InfoWindow();

    // Looping through the JSON data
    for (var i = 0, length = json.length; i < length; i++) {
        var data = json[i],
            latLng = new google.maps.LatLng(data.lat, data.lng);




        // Creating a marker and putting it on the map
        var marker = new google.maps.Marker({
            position: latLng,
            map: map,
            title: data.title
        });

        // Creating a closure to retain the correct data, notice how I pass the current data in the loop into the closure (marker, data)
        (function(marker, data) {

            // Attaching a click event to the current marker
            google.maps.event.addListener(marker, "click", function(e) {
                infoWindow.setContent(data.description);
                infoWindow.open(map, marker);
            });


        })(marker, data);

    }

}

   })();

C'est une réponse à la réponse de @ JoanmanuelHernández, mais je ne peux pas poster le code formaté dans un commentaire.

Joan, votre solution est excellente; C'est très similaire à la façon dont je le ferais moi-même. La création d'une gamme d'emplacements des marqueurs est bien meilleure que d'utiliser des variables individuelles pour chacun.

J'aimerais suggérer quelques améliorations mineures. L'un est l'endroit où vous avez la matrice nommée json . Ce n'est pas un nom très descriptif; JSON pourrait signifier tout type de données. Pourquoi ne pas l'appeler quelque chose comme lieux ou ou ou similaire?

Suivant, où vous avez la boucle qui crée la fermeture pour gérer le rappel asynchrone Je pense qu'il est un peu plus facile de comprendre comment cela fonctionne si vous déplacez tout le corps de la boucle dans sa propre fonction. Ensuite, vous n'avez pas besoin de la fonction anonyme inline. Donc, ce code: xxx

deviendrait: xxx

Il fait la même chose, un peu plus simple de cette façon.

une autre pensée: la carte de style est très cool-je suis un grand fan de cartes de style moi-même - mais je me demande s'il devrait être laissé ici pour des raisons de simplicité, car elle n'est pas " t liés à la question de l'OP?

N'hésitez pas à intégrer l'une de ces idées dans votre propre réponse si vous les aimez, et si quelqu'un d'autre trouve cette variation utile, veuillez UPvote la réponse de Joan depuis que c'est là que le code d'origine est venu de.