knockout- Google지도 표식 필터

Question

Google지도를 만들면 기본적으로 몇 개의 표식이 표시됩니다. 사용자가 특정 위치를 입력하면 해당 위치의 마커 만 남아 있어야하고 나머지 작업은 사라져야합니다. 다음과 같이 마커와지도가 작동하는 동안, 필터 기능을하지 working.My 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를 참조 할 때 함수를 호출해야하므로 괄호를 잊지 마십시오.