循环遍历gmarker对象数组并仅保留唯一的位置?

时间:2017-07-23 14:41:37

标签: javascript arrays google-maps google-maps-markers javascript-objects

我目前有一系列gmarker对象,并且对于相同位置(纬度和经度)存在重复的gmarkers但具有不同的信息窗口。这很好但我想使用标记簇并且只表示这些位置一次。

有没有办法循环遍历数组并可能创建另一个只包含唯一位置的数组? (纬度,经度)

我正在尝试这样的事情:

            var size = 0;
            var uniqueCustomers = []
            for (var i = 0; i < gmarkers.length; i++) {
                if (uniqueCustomers.indexOf(gmarkers[i]) < 0) {
                    uniqueCustomers[size] = gmarkers[i];
                    size = size + 1;
                }
            }

1 个答案:

答案 0 :(得分:0)

有多种方法可以做到这一点,但其中一种方法只是创建一个&#34;键&#34;根据每个标记的latlng,如果已经设置了密钥,则检查新对象(不是数组)uniqueCustomers,如果没有将标记添加到uniqueCustomers中。

&#13;
&#13;
var gmarkers = [] ;

var coords = [
  {lat : 42.1, lng:3.4},
  {lat : 42.2, lng:3.4},
  {lat : 42.3, lng:3.4},
  {lat : 42.4, lng:3.4},
  {lat : 42.1, lng:3.4},
  {lat : 42.2, lng:3.4}
] ;

for ( var i in coords )
{
  gmarkers.push(new google.maps.Marker({
       position:coords[i]
  })) ;
}

var size = 0;
var uniqueCustomers = {} ;

// Loop on the 6 markers
for (var i = 0; i < gmarkers.length; i++) {
  // Create a key to identify tje position of the marker
  var key = gmarkers[i].position.lat() + ',' + gmarkers[i].position.lng() ;
  
  // If this key is not already on uniqueCustomers, then we add the marker with this key to uniqueCustomers, so at the next loops if it exists we don't add it another time
  if ( typeof uniqueCustomers[key] == 'undefined' )
    uniqueCustomers[key] = gmarkers[i] ;
}

console.log('gmarkers.length',gmarkers.length) ; // 6
console.log('uniqueCustomers.length',Object.keys(uniqueCustomers).length) ; // 4
console.log('uniqueCustomers',Object.keys(uniqueCustomers)) ; // Display only uniques
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maps.googleapis.com/maps/api/js"></script>
&#13;
&#13;
&#13;