GoogleMapsAPI - create markers filter

1

I'm making a dynamic map using the Google Maps API that uses the markers to signal a list of pre-defined locations, such as:

 self.locations = [{
        name: 'Foxtrot',
        lat: 38.713905,
        lng: -9.1518868,
        type: 'Bar'
     }

It also has a Search field that allows filtering by the name of the locations (filteredNav). I should also filter the markers, but I can not. The recommendation I have is as follows:

  

Try writing console.log (self.location_array ()).   marker data modal is separate, you'll have to loop through   self.location_array () to process and find which one to show, which one   to hide by calling setVisible (or setMap) on the marker object.

// Create observable array
self.nav = ko.observableArray(self.locations);
// Create empty observable string
self.filter = ko.observable(''); 
// Show nav and filter
self.filteredNav = ko.computed(function() {

    var filter = self.filter().toLowerCase();

    if (!filter) {
        return self.nav();
    }
    return self.nav().filter(function(i) {
        // Check for proper casing or lowercase
        return i.name.toLowerCase().indexOf(filter) > -1 || i.name.indexOf(filter) > -1;
    });

    //problema neste loop! Não sei como o fazer
    for (var i = 0; i < location_array()[i].length; i++) {
    //??????
        location_array()[i].setVisible(true);
    }//?????


 }

note: implementation of observable array : vm.location_array()[i]

Link to the map How do I loop?

    
asked by anonymous 05.11.2016 / 01:23

1 answer

0

If I understand you, you need to filter the bookmarks, you should save them to an array and then remove the ones that are not in the list.

var markers = []; var m = new google.maps.Marker({ position: {lat: latitude, lng: .longitude}, map: $scope.map, animation: google.maps.Animation.DROP }); markers.push(m)

So you can control their display by removing or adding when needed.

    
06.11.2016 / 04:31