使用Geocoder()时，MarkerWithLabel仅显示google map API中的最后一个值 [英] MarkerWithLabel show only last value in the google map api when using Geocoder()

问题描述

当我用MarkerWithLabel添加标记时，它显示了不同的标记，但是与关联的值包含了数据中的最后一个值..就像在编写代码labelContent:building.value和title:building.Country_Name时在每个标记中一样，它显示了最后一个国家名在每个制造商职位(如尼泊尔)中，它显示的是诸如63这样的数据中的最后一个值.我有以下JSON格式的数据.

When I add marker with MarkerWithLabel it shows the different 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);
             }
        });
      

推荐答案

geocoder.geocode()函数是异步的，并且由于for循环中没有特殊作用域，因此building变量在每次迭代时都会被覆盖，从而导致geocode()函数稍后执行时重复的最后一个值.

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);
}

这篇关于使用Geocoder()时，MarkerWithLabel仅显示google map API中的最后一个值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！