Google Map API - Removing Markers

Question

I ve tried looking at a large variety of code blocks here and on the Google Maps API documentation but STILL have not been able to figure out how to hide markers   This is the current code that I am using  and it worked for one instance  Once I added the  for  loop in the function with markers setMap null  Firefox displays the following error   Error  TypeError  markers setMap is not a function  function removeMarkers        var markers      alert markers       alert locations length       for  i   0  i lt locations length  i             markers   locations i           alert markers title           markers setMap null             Additional Information  Campus Map and full code  excluding Map API

User · Accepted Answer

You need to keep an array of the google maps Marker objects to hide  or remove or run other operations on them    In the global scope   var gmarkers         Then push the markers on that array as you create them   var marker   new google maps Marker       position  new google maps LatLng locations i  latitude  locations i  longitude       title  locations i  title      icon  icon      map map         Push your newly created marker into the array  gmarkers push marker     Then to remove them   function removeMarkers        for i 0  i lt gmarkers length  i             gmarkers i  setMap null             working example  toggles the markers   code snippet    x000D   x000D  var gmarkers       x000D  var RoseHulman   new google maps LatLng 39 483558  -87 324593   x000D  var styles      x000D    stylers     x000D      hue   black  x000D         x000D      saturation  -90 x000D       x000D       x000D    featureType   road   x000D    elementType   geometry   x000D    stylers     x000D      lightness  100 x000D         x000D      visibility   simplified  x000D       x000D       x000D    featureType   road   x000D    elementType   labels   x000D    stylers     x000D      visibility   on  x000D       x000D      x000D   x000D  var styledMap   new google maps StyledMapType styles    x000D    name   Campus  x000D      x000D  var mapOptions     x000D    center  RoseHulman  x000D    zoom  15  x000D    mapTypeControl  true  x000D    zoomControl  true  x000D    zoomControlOptions    x000D      style  google maps ZoomControlStyle SMALL x000D       x000D    mapTypeControlOptions    x000D      mapTypeIds    map style   google maps MapTypeId HYBRID   x000D      style  google maps MapTypeControlStyle DROPDOWN MENU x000D       x000D    scrollwheel  false  x000D    streetViewControl  true  x000D   x000D     x000D   x000D  var map   new google maps Map document getElementById  map    mapOptions   x000D  map mapTypes set  map style   styledMap   x000D  map setMapTypeId  map style    x000D   x000D  var infowindow   new google maps InfoWindow   x000D    maxWidth  300  x000D    infoBoxClearance  new google maps Size 1  1   x000D    disableAutoPan  false x000D      x000D   x000D  var marker  i  icon  image  x000D   x000D  var locations      x000D     id    1   x000D     category    6   x000D     campus location    F2   x000D     title    Alpha Tau Omega Fraternity   x000D     description     lt p gt Alpha Tau Omega house lt  p gt    x000D     longitude    -87 321133   x000D     latitude    39 484092  x000D       x000D     id    2   x000D     category    6   x000D     campus location    B2   x000D     title    Apartment Commons   x000D     description     lt p gt The commons area of the apartment-style residential complex lt  p gt    x000D     longitude    -87 329282   x000D     latitude    39 483599  x000D       x000D     id    3   x000D     category    6   x000D     campus location    B2   x000D     title    Apartment East   x000D     description     lt p gt Apartment East lt  p gt    x000D     longitude    -87 328809   x000D     latitude    39 483748  x000D       x000D     id    4   x000D     category    6   x000D     campus location    B2   x000D     title    Apartment West   x000D     description     lt p gt Apartment West lt  p gt    x000D     longitude    -87 329732   x000D     latitude    39 483429  x000D       x000D     id    5   x000D     category    6   x000D     campus location    C2   x000D     title    Baur-Sames-Bogart  BSB  Hall   x000D     description     lt p gt Baur-Sames-Bogart Hall lt  p gt    x000D     longitude    -87 325714   x000D     latitude    39 482382  x000D       x000D     id    6   x000D     category    6   x000D     campus location    D3   x000D     title    Blumberg Hall   x000D     description     lt p gt Blumberg Hall lt  p gt    x000D     longitude    -87 328321   x000D     latitude    39 483388  x000D       x000D     id    7   x000D     category    1   x000D     campus location    E1   x000D     title    The Branam Innovation Center   x000D     description     lt p gt The Branam Innovation Center lt  p gt    x000D     longitude    -87 322614   x000D     latitude    39 48494  x000D       x000D     id    8   x000D     category    6   x000D     campus location    G3   x000D     title    Chi Omega Sorority   x000D     description     lt p gt Chi Omega house lt  p gt    x000D     longitude    -87 319905   x000D     latitude    39 482071  x000D       x000D     id    9   x000D     category    3   x000D     campus location    D1   x000D     title    Cook Stadium Phil Brown Field   x000D     description     lt p gt Cook Stadium at Phil Brown Field lt  p gt    x000D     longitude    -87 325258   x000D     latitude    39 485007  x000D       x000D     id    10   x000D     category    1   x000D     campus location    D2   x000D     title    Crapo Hall   x000D     description     lt p gt Crapo Hall lt  p gt    x000D     longitude    -87 324368   x000D     latitude    39 483709  x000D       x000D     id    11   x000D     category    6   x000D     campus location    G3   x000D     title    Delta Delta Delta Sorority   x000D     description     lt p gt Delta Delta Delta lt  p gt    x000D     longitude    -87 317477   x000D     latitude    39 482951  x000D       x000D     id    12   x000D     category    6   x000D     campus location    D2   x000D     title    Deming Hall   x000D     description     lt p gt Deming Hall lt  p gt    x000D     longitude    -87 325822   x000D     latitude    39 483421  x000D       x000D     id    13   x000D     category    5   x000D     campus location    F1   x000D     title    Facilities Operations   x000D     description     lt p gt Facilities Operations lt  p gt    x000D     longitude    -87 321782   x000D     latitude    39 484916  x000D       x000D     id    14   x000D     category    2   x000D     campus location    E3   x000D     title    Flame of the Millennium   x000D     description     lt p gt Flame of Millennium sculpture lt  p gt    x000D     longitude    -87 323306   x000D     latitude    39 481978  x000D       x000D     id    15   x000D     category    5   x000D     campus location    E2   x000D     title    Hadley Hall   x000D     description     lt p gt Hadley Hall lt  p gt    x000D     longitude    -87 324046   x000D     latitude    39 482887  x000D       x000D     id    16   x000D     category    2   x000D     campus location    F2   x000D     title    Hatfield Hall   x000D     description     lt p gt Hatfield Hall lt  p gt    x000D     longitude    -87 322340   x000D     latitude    39 482146  x000D       x000D     id    17   x000D     category    6   x000D     campus location    C2   x000D     title    Hulman Memorial Union   x000D     description     lt p gt Hulman Memorial Union lt  p gt    x000D     longitude    -87 32698   x000D     latitude    39 483574  x000D       x000D     id    18   x000D     category    1   x000D     campus location    E2   x000D     title    John T  Myers Center for Technological Research with Industry   x000D     description     lt p gt John T  Myers Center for Technological Research With Industry lt  p gt    x000D     longitude    -87 322984   x000D     latitude    39 484063  x000D       x000D     id    19   x000D     category    6   x000D     campus location    A2   x000D     title    Lakeside Hall   x000D     description     lt p gt  lt  p gt    x000D     longitude    -87 330612   x000D     latitude    39 482804  x000D       x000D     id    20   x000D     category    6   x000D     campus location    F2   x000D     title    Lambda Chi Alpha Fraternity   x000D     description     lt p gt Lambda Chi Alpha lt  p gt    x000D     longitude    -87 320999   x000D     latitude    39 48305  x000D       x000D     id    21   x000D     category    1   x000D     campus location    D2   x000D     title    Logan Library   x000D     description     lt p gt Logan Library lt  p gt    x000D     longitude    -87 324851   x000D     latitude    39 483408  x000D       x000D     id    22   x000D     category    6   x000D     campus location    C2   x000D     title    Mees Hall   x000D     description     lt p gt Mees Hall lt  p gt    x000D     longitude    -87 32778   x000D     latitude    39 483533  x000D       x000D     id    23   x000D     category    1   x000D     campus location    E2   x000D     title    Moench Hall   x000D     description     lt p gt Moench Hall lt  p gt    x000D     longitude    -87 323695   x000D     latitude    39 483471  x000D       x000D     id    24   x000D     category    1   x000D     campus location    G4   x000D     title    Oakley Observatory   x000D     description     lt p gt Oakley Observatory lt  p gt    x000D     longitude    -87 31616   x000D     latitude    39 483789  x000D       x000D     id    25   x000D     category    1   x000D     campus location    D2   x000D     title    Olin Hall and Olin Advanced Learning Center   x000D     description     lt p gt Olin Hall lt  p gt    x000D     longitude    -87 324550   x000D     latitude    39 482796  x000D       x000D     id    26   x000D     category    6   x000D     campus location    C3   x000D     title    Percopo Hall   x000D     description     lt p gt Percopo Hall lt  p gt    x000D     longitude    -87 328182   x000D     latitude    39 482121  x000D       x000D     id    27   x000D     category    6   x000D     campus location    G3   x000D     title    Public Safety Office   x000D     description     lt p gt The Office of Public Safety lt  p gt    x000D     longitude    -87 320377   x000D     latitude    39 48191  x000D       x000D     id    28   x000D     category    1   x000D     campus location    E2   x000D     title    Rotz Mechanical Engineering Lab   x000D     description     lt p gt Rotz Lab lt  p gt    x000D     longitude    -87 323247   x000D     latitude    39 483711  x000D       x000D     id    28   x000D     category    6   x000D     campus location    C2   x000D     title    Scharpenberg Hall   x000D     description     lt p gt Scharpenberg Hall lt  p gt    x000D     longitude    -87 328139   x000D     latitude    39 483582  x000D       x000D     id    29   x000D     category    6   x000D     campus location    G2   x000D     title    Sigma Nu Fraternity   x000D     description     lt p gt The Sigma Nu house lt  p gt    x000D     longitude    -87 31999   x000D     latitude    39 48374  x000D       x000D     id    30   x000D     category    6   x000D     campus location    E4   x000D     title    South Campus   Rose-Hulman Ventures   x000D     description     lt p gt  lt  p gt    x000D     longitude    -87 330623   x000D     latitude    39 417646  x000D       x000D     id    31   x000D     category    6   x000D     campus location    C3   x000D     title    Speed Hall   x000D     description     lt p gt Speed Hall lt  p gt    x000D     longitude    -87 326632   x000D     latitude    39 482121  x000D       x000D     id    32   x000D     category    3   x000D     campus location    C1   x000D     title    Sports and Recreation Center   x000D     description     lt p gt  lt  p gt    x000D     longitude    -87 3272   x000D     latitude    39 484874  x000D       x000D     id    33   x000D     category    6   x000D     campus location    F2   x000D     title    Triangle Fraternity   x000D     description     lt p gt Triangle fraternity lt  p gt    x000D     longitude    -87 32113   x000D     latitude    39 483659  x000D       x000D     id    34   x000D     category    6   x000D     campus location    B3   x000D     title    White Chapel   x000D     description     lt p gt The White Chapel lt  p gt    x000D     longitude    -87 329367   x000D     latitude    39 482481  x000D       x000D     id    35   x000D     category    6   x000D     campus location    F2   x000D     title    Women s Fraternity Housing   x000D     description       x000D     image       x000D     longitude    -87 320753   x000D     latitude    39 482401  x000D       x000D     id    36   x000D     category    3   x000D     campus location    E1   x000D     title    Intramural Fields   x000D     description     lt p gt  lt  p gt    x000D     longitude    -87 321267   x000D     latitude    39 485934  x000D       x000D     id    37   x000D     category    3   x000D     campus location    A3   x000D     title    James Rendel Soccer Field   x000D     description     lt p gt  lt  p gt    x000D     longitude    -87 332135   x000D     latitude    39 480933  x000D       x000D     id    38   x000D     category    3   x000D     campus location    B2   x000D     title    Art Nehf Field   x000D     description     lt p gt Art Nehf Field lt  p gt    x000D     longitude    -87 330923   x000D     latitude    39 48022  x000D       x000D     id    39   x000D     category    3   x000D     campus location    B2   x000D     title    Women s Softball Field   x000D     description     lt p gt  lt  p gt    x000D     longitude    -87 329904   x000D     latitude    39 480278  x000D       x000D     id    40   x000D     category    3   x000D     campus location    D1   x000D     title    Joy Hulbert Tennis Courts   x000D     description     lt p gt The Joy Hulbert Outdoor Tennis Courts lt  p gt    x000D     longitude    -87 323767   x000D     latitude    39 485595  x000D       x000D     id    41   x000D     category    6   x000D     campus location    B2   x000D     title    Speed Lake   x000D     description       x000D     image       x000D     longitude    -87 328134   x000D     latitude    39 482779  x000D       x000D     id    42   x000D     category    5   x000D     campus location    F1   x000D     title    Recycling Center   x000D     description       x000D     image       x000D     longitude    -87 320098   x000D     latitude    39 484593  x000D       x000D     id    43   x000D     category    1   x000D     campus location    F3   x000D     title    Army ROTC   x000D     description       x000D     image       x000D     longitude    -87 321342   x000D     latitude    39 481992  x000D       x000D     id    44   x000D     category    2   x000D     campus location         x000D     title    Self Made Man   x000D     description       x000D     image       x000D     longitude    -87 326272   x000D     latitude    39 484481  x000D       x000D     id    P1   x000D     category    4   x000D     title    Percopo Parking   x000D     description       x000D     image       x000D     longitude    -87 328756   x000D     latitude    39 481587  x000D       x000D     id    P2   x000D     category    4   x000D     title    Speed Parking   x000D     description       x000D     image       x000D     longitude    -87 327361   x000D     latitude    39 481694  x000D       x000D     id    P3   x000D     category    4   x000D     title    Main Parking   x000D     description       x000D     image       x000D     longitude    -87 326245   x000D     latitude    39 481446  x000D       x000D     id    P4   x000D     category    4   x000D     title    Lakeside Parking   x000D     description       x000D     image       x000D     longitude    -87 330848   x000D     latitude    39 483284  x000D       x000D     id    P5   x000D     category    4   x000D     title    Hatfield Hall Parking   x000D     description       x000D     image       x000D     longitude    -87 321417   x000D     latitude    39 482398  x000D       x000D     id    P6   x000D     category    4   x000D     title    Women s Fraternity Parking   x000D     description       x000D     image       x000D     longitude    -87 320977   x000D     latitude    39 482315  x000D       x000D     id    P7   x000D     category    4   x000D     title    Myers and Facilities Parking   x000D     description       x000D     image       x000D     longitude    -87 322243   x000D     latitude    39 48417  x000D       x000D     id    P8   x000D     category    4   x000D     title       x000D     description       x000D     image       x000D     longitude    -87 323241   x000D     latitude    39 484758  x000D       x000D     id    P9   x000D     category    4   x000D     title       x000D     description       x000D     image       x000D     longitude    -87 323617   x000D     latitude    39 484311  x000D       x000D     id    P10   x000D     category    4   x000D     title       x000D     description       x000D     image       x000D     longitude    -87 325714   x000D     latitude    39 484584  x000D       x000D     id    P11   x000D     category    4   x000D     title       x000D     description       x000D     image       x000D     longitude    -87 32778   x000D     latitude    39 484145  x000D       x000D     id    P12   x000D     category    4   x000D     title       x000D     description       x000D     image       x000D     longitude    -87 329035   x000D     latitude    39 4848  x000D      x000D   x000D  for  i   0  i  lt  locations length  i      x000D   x000D    var marker   new google maps Marker   x000D      position  new google maps LatLng locations i  latitude  locations i  longitude   x000D      title  locations i  title  x000D      map  map x000D        x000D    gmarkers push marker   x000D    google maps event addListener marker   click    function marker  i    x000D      return function     x000D        if  locations i  description           locations i  title           x000D          infowindow setContent   lt div class  content  id  content-    locations i  id   x000D               style  max-height 300px  font-size 12px   gt  lt h3 gt     locations i  title     lt  h3 gt     x000D              lt hr class  grey    gt     x000D            hasImage locations i     x000D            locations i  description      lt  div gt    x000D          infowindow open map  marker   x000D          x000D        x000D       marker  i    x000D    x000D   x000D  function toggleMarkers     x000D    for  i   0  i  lt  gmarkers length  i      x000D      if  gmarkers i  getMap      null  gmarkers i  setMap null   x000D      else gmarkers i  setMap map   x000D      x000D    x000D   x000D  function hasImage location    x000D    return     x000D    x000D  html  x000D  body  x000D   map   x000D    height  100   x000D    width  100   x000D    x000D   lt script src  https   ajax googleapis com ajax libs jquery 2 1 1 jquery min js  gt  lt  script gt  x000D   lt script src  https   maps googleapis com maps api js key AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk  gt  lt  script gt  x000D   lt div id  controls  gt  x000D     lt input type  button  value  Toggle All Markers  onClick  toggleMarkers      gt  x000D   lt  div gt  x000D   lt div id  map  gt  lt  div gt  x000D   x000D   x000D

User · Answer

Following code might be useful if someone is using React and has a different component of Marker and want to remove marker from map  export default function useGoogleMapMarker props      const  marker  setMarker    useState       useEffect      gt              code     const marker   new maps Marker   position  map  title  icon               code     setMarker marker       return      gt  marker setMap null      to remove markers when unmounts              return marker

User · Answer

According to Google documentation they said that this is the best way to do it. First create this function to find out how many markers there are/

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

Next create another function to take away all these markers

 function clearMarker(){
setMapOnAll(null);
}

Then create this final function to erase all the markers when ever this function is called upon.

 function delateMarkers(){
clearMarker()
markers = []
//console.log(markers) This is just if you want to

}

Hope that helped good luck

User · Answer

You can try this      markers markers length-1  setMap null     Hope it works

[google-maps] Google Map API - Removing Markers

The answer is

Examples related to google-maps

Examples related to google-maps-api-3

Tags