带有标题的标记,总是重复标题

时间:2014-10-21 14:41:22

标签: google-maps markers

我有一个位置和描述的对象,标记在地图上有很好的标记,但标题总是" gato"。我试过像clousers这样的东西,但它不起作用或我没有正确使用。嵌套for循环,循环对象,它确实获取位置但不是描述,哪一个是所有时间。任何人都可以帮助我吗?这是我的代码:

/*OBJECT */

  var addresses1 = {
            "address_1": {
                "location": "Avenida de burgos, 9, madrid",
                "description": "gallina"
            },
            "address_2": {
                "location": "castellana, 169, madrid",
                "description": "pollo"
            },
            "address_3": {
                "location": "bilbao, 5, madrid",
                "description": "gato"
            }                
        }

/* NEsted loop indie the intilize() method */

         for (var key in addresses1) {
                var obj = addresses1[key];
                for (var y = 0; y < 1; y++) {

                    var locat = obj.location;
                    var descrip = obj.description;

                    var myAddressQuery = locat;
                    var geocoder = new google.maps.Geocoder();
                    geocoder.geocode({'address': myAddressQuery}, function(results, status) {

                            map.setCenter(results[0].geometry.location);
                            var marker = new google.maps.Marker({
                                map: map,
                                icon: image,
                                position: results[0].geometry.location,
                                title: descrip
                            });                    
                    });


                }
            }

1 个答案:

答案 0 :(得分:0)

similar question

如果您添加&#34; geocodeAddress&#34;对你的代码起作用(为了在变量上获得函数闭包以创建标记,它将起作用。

function geocodeAddress(maddress, description, image, map) {
  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    'address': maddress
  }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {

      var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
      var marker = new google.maps.Marker({
        position: results[0].geometry.location,
        icon: image,
        map: map,
        title: description
      });
      map.setCenter(results[0].geometry.location);
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}

working fiddle

代码段:

&#13;
&#13;
var geocoder;
var map;
var addresses1 = {
  "address_1": {
    "location": "Avenida de burgos, 9, madrid",
    "description": "gallina"
  },
  "address_2": {
    "location": "castellana, 169, madrid",
    "description": "pollo"
  },
  "address_3": {
    "location": "bilbao, 5, madrid",
    "description": "gato"
  }
};

function geocodeAddress(maddress, description, image, map) {
  var geocoder = new google.maps.Geocoder();
  geocoder.geocode({
    'address': maddress
  }, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {

      var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
      var marker = new google.maps.Marker({
        position: results[0].geometry.location,
        icon: image,
        map: map,
        title: description
      });
      map.setCenter(results[0].geometry.location);
    } else {
      alert("Geocode was not successful for the following reason: " + status);
    }
  });
}

function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var image = "http://maps.google.com/mapfiles/ms/micons/blue-dot.png";

  for (var key in addresses1) {
    var obj = addresses1[key];
    for (var y = 0; y < 1; y++) {

      var locat = obj.location;
      var descrip = obj.description;

      geocodeAddress(locat, descrip, image, map);
    }
  }


}
google.maps.event.addDomListener(window, "load", initialize);
&#13;
html,
body,
#map_canvas {
  height: 500px;
  width: 500px;
  margin: 0px;
  padding: 0px
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&ext=.js"></script>
<div id="map_canvas" style="width:750px; height:450px; border: 2px solid #3872ac;"></div>
&#13;
&#13;
&#13;