CODEWITHSUNDEEP
jquerygoogle-maps-api-3google-maps-markers
jamesteague
jamesteague

Reputation: 47

hide/show marker categories Google Maps API

So after some fantastic help from users here I now have a button to hide all of the map markers on my website. However I need to be able to hide markers based on their category.

The code below passes the results from Google to a markers array

  function createMarker(place) {
    var iconType = {};
    iconType['atm'] = "http://maps.google.com/mapfiles/ms/micons/dollar.png";
    iconType['bus_station'] = "http://maps.google.com/mapfiles/ms/micons/bus.png";
    //iconType['restaurant'] = "http://maps.google.com/mapfiles/ms/micons/restaurant.png";
    iconType['parking'] = "http://maps.google.com/mapfiles/ms/micons/parkinglot.png";
    var placeLoc = place.geometry.location;
    var marker = new google.maps.Marker({
      map : map,
      icon : iconType[place.types[0]],
      position : place.geometry.location,
      category : category
    });

    google.maps.event.addListener(marker, 'click', function() {
      infowindow.setContent(place.name);
      infowindow.open(map, this);
    });

    return marker;
  }

I think that the category attribute should now be populated with the response from google, the problem I now have is chosing these results (a particular category) when I call my function to hide the markers, I dont know how to access the array data for category, I have searched multiple threads here but their code is vastly different from mine. My code for hiding the markers is here.

  function onRemoveBtn_Clicked() {
    var i;
    for (i = 0; i < markers.length; i++) {
      markers[i].setMap(null);
    }
  }

Any help greatly appreciated. Oh, and the code used to get the results is. 

service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, callback);
  function callback(results, status) {
    if (status == google.maps.places.PlacesServiceStatus.OK) {
      for (var i = 0; i < results.length; i++) {
        var place = results[i];
        markers.push(createMarker(results[i]));
      }
    }
  }

Upvotes: 0

Views: 2329

Answers (1)

wf9a5m75
wf9a5m75

Reputation: 6158

You can get the category of the marker like this:

function onRemoveBtn_Clicked() {
    var i;
    for (i = 0; i < markers.length; i++) {
      if (markers[i].get("category") != selected_category) {
        markers[i].setMap(null);
      }
    }
  }

Upvotes: 1

Related Questions