MarkerWithLabel show only last value in the google map api when using Geocoder()

一世执手 提交于 2020-01-06 03:28:25

问题


when i add marker with MarkerWithLabel it shows the differnent markers,but the value associated with contains the last value from the data..like in each marker when writing code labelContent:building.value,and title:building.Country_Name, it shows the last country name in each maker position like Nepal it shows the last value from data like..63 in this condition. I have below json format data.

       var recipient_country = [{"Country_Name": "MYANMAR", "value": 123},
       {"Country_Name": "MONGOLIA", "value": 11},
       {"Country_Name": "ZIMBABWE", "value": 22},
       {"Country_Name": "Bahrain", "value": 45},
       {"Country_Name": "Nepal", "value": 63}];



  for(var i= 0; i < recipient_country.length; i++) {
        console.log(i);
        var building = recipient_country[i];
        console.log(building.Country_Name);

        geocoder.geocode({'address':building.Country_Name}, function(results,status){
          console.log(results);
          if(status == google.maps.GeocoderStatus.OK){
            var marker = new MarkerWithLabel({
              position:results[0].geometry.location,
              title:building.Country_Name,

              map:map,
              labelContent:building.value,
              labelAnchor:new google.maps.Point(6,22),
              labelClass:"labels",
              labelInBackground:false,
              icon:"circle2.png"
            });
             console.log(building.Country_Name)
          }
          else{
                 console.log("Geocode was not  succcessful for the following reason:" + status);
             }
        });

回答1:


The geocoder.geocode() function is asynchronous, and since there's no special scope in a for loop the building variable is overwritten on each iteration leaving you with the last value iterated when the geocode() function executes at a later time.

You have to lock in the value with a new scope :

for (var j = 0; j < recipient_country.length; j++) {
    (function(i) {
        var building = recipient_country[i];

        geocoder.geocode({
            'address': building.Country_Name
        }, function (results, status) {
            console.log(results);
            if (status == google.maps.GeocoderStatus.OK) {
                var marker = new MarkerWithLabel({
                    position: results[0].geometry.location,
                    title: building.Country_Name,

                    map: map,
                    labelContent: building.value,
                    labelAnchor: new google.maps.Point(6, 22),
                    labelClass: "labels",
                    labelInBackground: false,
                    icon: "circle2.png"
                });
                console.log(building.Country_Name)
            } else {
                console.log("Geocode was not  succcessful for the following reason:" + status);
            }
        });
    })(j);
}


来源:https://stackoverflow.com/questions/24505133/markerwithlabel-show-only-last-value-in-the-google-map-api-when-using-geocoder

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!