仅显示给定半径内的标记

Question

我试图制作一个只显示给定半径内的标记的算法，这是我的代码：

for( i = 0; i < markers.length; i++ ) {
    d = google.maps.geometry.spherical.computeDistanceBetween(
        new google.maps.LatLng(user_logged_in[0][0],user_logged_in[0][1]),
        new google.maps.LatLng(markers[i][0], markers[i][1]));
    var position = new google.maps.LatLng(markers[i][0], markers[i][1]);
    var icon = {url:"http://".concat(markers[i][3]),
                scaledSize: new google.maps.Size(20, 20), // scaled size
                origin: new google.maps.Point(0,0), // origin
                anchor: new google.maps.Point(0, 0) };
    marker = new google.maps.Marker({
        position: position,
        map: map,
        title: markers[i][4].toString().concat(' ').concat(markers[i][5].toString()),
        icon: icon, 
        url:'im:<sip:'+markers[i][6]+'>'
    });
    if(<?=$this->translate($this->layout()->is_super_admin)?>==0){ 
        marker.setVisible(false);
        $(document).ready(function() {
            $('#select-distance').change(function() {
                var e = document.getElementById("select-distance");
                var value =  parseInt(e.options[e.selectedIndex].value);
                if(d < value){                     
                    marker.setVisible(true);
                }else{
                    marker.setVisible(false); 
                }
                circle.setRadius(value);
                circle.bindTo('center', markerc, 'position');
                find_closest_marker(value);  
            });
        });
    }
}

但是当我测试它时，它只适用于给定半径内的最后一个用户。例如，如果我有 3 个距离为 2 公里、3 公里、1 公里的用户，我选择半径为 5 公里，我只得到 3 公里的用户！！！感谢您的帮助。

Answer 1

为每个标记创建新对象并使用该对象。

见下文：

 //here use the var keyword and a new marker object
var marker[i] = new google.maps.Marker({
         position: position,
         map: map,
         title: markers[i][4].toString().concat(' ').concat(markers[i][5].toString()),
         icon: icon, 
         url:'im:<sip:'+markers[i][6]+'>'
     });

     if(<?=$this->translate($this->layout()->is_super_admin)?>==0){ 
         marker[i].setVisible(false);
        $(document).ready(function() {
            $('#select-distance').change(function() {
             var e = document.getElementById("select-distance");
             var value =  parseInt(e.options[e.selectedIndex].value);
             if(d < value){                     
                marker[i].setVisible(true);
             }else{
                marker[i].setVisible(false); 
             }
             circle.setRadius(value);
             circle.bindTo('center', markerc, 'position');
             find_closest_marker(value);  
           });
        });

您每次都使用相同的对象，因此它正在替换之前的对象。这就是为什么它只绘制最后一个标记。