Question

我正在创建一个谷歌地图，默认显示一些标记。当用户进入特定位置时，只有该位置的标记必须保留，其余的工作必须消失。当标记和地图正常工作时，过滤器功能无效。我的JS代码如下：

function inintMap()
{

var map;
var bounds = new google.maps.LatLngBounds();
var mapOptions = {
    mapTypeId : 'roadmap'
};

map = new google.maps.Map(document.getElementById('map'),mapOptions);
map.setTilt(45);

var locations = [
        ['London Eye, London', 51.503454,-0.119562],
        ['Palace of Westminster, London', 51.499633,-0.124755]
    ];



for (i=0; i < locations.length; i++)
{ var position = new google.maps.LatLng(locations [i][1],locations [i][2] );
bounds.extend (position);
marker = new google.maps.Marker({
    position : position,
    map : map,
    title : locations [i][0]
});


        map.fitBounds(bounds);


}



var vm =  {
     locations: ko.observableArray(locations)
 };


 vm.query = ko.observable('')
 vm.search = function(value){

    vm.locations.removeAll()

    for(var x in locations) {
      if(locations[x].name.toLowerCase().indexOf(value.toLowerCase()) >= 0) {
        viewModel.locations.push(locations[x]);
      }
    }
  }


vm.query.subscribe(vm.search);
ko.applyBindings(vm);
}

Answer 1

vm.locations.removeAll()。从该代码开始，您甚至可以删除所有位置，然后才能从中搜索。首先搜索它并将搜索到的位置放在另一个数组中，然后只需用新数组替换位置即可。

vm.search = function(value){
    var tempLocations = []; 
    for(var x in vm.locations()) {
      if(vm.locations()[x].name.toLowerCase().indexOf(value.toLowerCase()) >= 0) {
        tempLocations.push(vm.locations()[x]);
      }
    }
    vm.locations(tempLocations);
}

另外，请注意，在引用observablearrays时，您需要将其称为函数，不要忘记括号。

淘汰赛 - 谷歌地图标记过滤器

1 个答案: