Google Map API - Removing Markers -


i've tried looking @ large variety of code blocks here , on google maps api documentation still have not been able figure out how hide markers.

this current code using, , worked 1 instance. once added "for" loop in function markers.setmap(null) firefox displays following error:

error: typeerror: markers.setmap not function

function removemarkers(){     var markers;     alert(markers);     alert(locations.length);     (i = 0; i<locations.length; i++){         markers = locations[i];         alert(markers.title);         markers.setmap(null);     } } 

additional information: campus map , full code (excluding map api)

you need keep array of google.maps.marker objects hide (or remove or run other operations on them).

in global scope:

var gmarkers = []; 

then push markers on array 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 newly created marker array: gmarkers.push(marker); 

then remove them:

function removemarkers(){     for(i=0; i<gmarkers.length; i++){         gmarkers[i].setmap(null);     } } 

working example (toggles markers)

code snippet:

var gmarkers = [];  var rosehulman = new google.maps.latlng(39.483558, -87.324593);  var styles = [{    stylers: [{      hue: "black"    }, {      saturation: -90    }]  }, {    featuretype: "road",    elementtype: "geometry",    stylers: [{      lightness: 100    }, {      visibility: "simplified"    }]  }, {    featuretype: "road",    elementtype: "labels",    stylers: [{      visibility: "on"    }]  }];    var styledmap = new google.maps.styledmaptype(styles, {    name: "campus"  });  var mapoptions = {    center: rosehulman,    zoom: 15,    maptypecontrol: true,    zoomcontrol: true,    zoomcontroloptions: {      style: google.maps.zoomcontrolstyle.small    },    maptypecontroloptions: {      maptypeids: ['map_style', google.maps.maptypeid.hybrid],      style: google.maps.maptypecontrolstyle.dropdown_menu    },    scrollwheel: false,    streetviewcontrol: true,    };    var map = new google.maps.map(document.getelementbyid('map'), mapoptions);  map.maptypes.set('map_style', styledmap);  map.setmaptypeid('map_style');    var infowindow = new google.maps.infowindow({    maxwidth: 300,    infoboxclearance: new google.maps.size(1, 1),    disableautopan: false  });    var marker, i, icon, image;    var locations = [{    "id": "1",    "category": "6",    "campus_location": "f2",    "title": "alpha tau omega fraternity",    "description": "<p>alpha tau omega house</p>",    "longitude": "-87.321133",    "latitude": "39.484092"  }, {    "id": "2",    "category": "6",    "campus_location": "b2",    "title": "apartment commons",    "description": "<p>the commons area of apartment-style residential complex</p>",    "longitude": "-87.329282",    "latitude": "39.483599"  }, {    "id": "3",    "category": "6",    "campus_location": "b2",    "title": "apartment east",    "description": "<p>apartment east</p>",    "longitude": "-87.328809",    "latitude": "39.483748"  }, {    "id": "4",    "category": "6",    "campus_location": "b2",    "title": "apartment west",    "description": "<p>apartment west</p>",    "longitude": "-87.329732",    "latitude": "39.483429"  }, {    "id": "5",    "category": "6",    "campus_location": "c2",    "title": "baur-sames-bogart (bsb) hall",    "description": "<p>baur-sames-bogart hall</p>",    "longitude": "-87.325714",    "latitude": "39.482382"  }, {    "id": "6",    "category": "6",    "campus_location": "d3",    "title": "blumberg hall",    "description": "<p>blumberg hall</p>",    "longitude": "-87.328321",    "latitude": "39.483388"  }, {    "id": "7",    "category": "1",    "campus_location": "e1",    "title": "the branam innovation center",    "description": "<p>the branam innovation center</p>",    "longitude": "-87.322614",    "latitude": "39.48494"  }, {    "id": "8",    "category": "6",    "campus_location": "g3",    "title": "chi omega sorority",    "description": "<p>chi omega house</p>",    "longitude": "-87.319905",    "latitude": "39.482071"  }, {    "id": "9",    "category": "3",    "campus_location": "d1",    "title": "cook stadium/phil brown field",    "description": "<p>cook stadium @ phil brown field</p>",    "longitude": "-87.325258",    "latitude": "39.485007"  }, {    "id": "10",    "category": "1",    "campus_location": "d2",    "title": "crapo hall",    "description": "<p>crapo hall</p>",    "longitude": "-87.324368",    "latitude": "39.483709"  }, {    "id": "11",    "category": "6",    "campus_location": "g3",    "title": "delta delta delta sorority",    "description": "<p>delta delta delta</p>",    "longitude": "-87.317477",    "latitude": "39.482951"  }, {    "id": "12",    "category": "6",    "campus_location": "d2",    "title": "deming hall",    "description": "<p>deming hall</p>",    "longitude": "-87.325822",    "latitude": "39.483421"  }, {    "id": "13",    "category": "5",    "campus_location": "f1",    "title": "facilities operations",    "description": "<p>facilities operations</p>",    "longitude": "-87.321782",    "latitude": "39.484916"  }, {    "id": "14",    "category": "2",    "campus_location": "e3",    "title": "flame of millennium",    "description": "<p>flame of millennium sculpture</p>",    "longitude": "-87.323306",    "latitude": "39.481978"  }, {    "id": "15",    "category": "5",    "campus_location": "e2",    "title": "hadley hall",    "description": "<p>hadley hall</p>",    "longitude": "-87.324046",    "latitude": "39.482887"  }, {    "id": "16",    "category": "2",    "campus_location": "f2",    "title": "hatfield hall",    "description": "<p>hatfield hall</p>",    "longitude": "-87.322340",    "latitude": "39.482146"  }, {    "id": "17",    "category": "6",    "campus_location": "c2",    "title": "hulman memorial union",    "description": "<p>hulman memorial union</p>",    "longitude": "-87.32698",    "latitude": "39.483574"  }, {    "id": "18",    "category": "1",    "campus_location": "e2",    "title": "john t. myers center technological research industry",    "description": "<p>john t. myers center technological research industry</p>",    "longitude": "-87.322984",    "latitude": "39.484063"  }, {    "id": "19",    "category": "6",    "campus_location": "a2",    "title": "lakeside hall",    "description": "<p></p>",    "longitude": "-87.330612",    "latitude": "39.482804"  }, {    "id": "20",    "category": "6",    "campus_location": "f2",    "title": "lambda chi alpha fraternity",    "description": "<p>lambda chi alpha</p>",    "longitude": "-87.320999",    "latitude": "39.48305"  }, {    "id": "21",    "category": "1",    "campus_location": "d2",    "title": "logan library",    "description": "<p>logan library</p>",    "longitude": "-87.324851",    "latitude": "39.483408"  }, {    "id": "22",    "category": "6",    "campus_location": "c2",    "title": "mees hall",    "description": "<p>mees hall</p>",    "longitude": "-87.32778",    "latitude": "39.483533"  }, {    "id": "23",    "category": "1",    "campus_location": "e2",    "title": "moench hall",    "description": "<p>moench hall</p>",    "longitude": "-87.323695",    "latitude": "39.483471"  }, {    "id": "24",    "category": "1",    "campus_location": "g4",    "title": "oakley observatory",    "description": "<p>oakley observatory</p>",    "longitude": "-87.31616",    "latitude": "39.483789"  }, {    "id": "25",    "category": "1",    "campus_location": "d2",    "title": "olin hall , olin advanced learning center",    "description": "<p>olin hall</p>",    "longitude": "-87.324550",    "latitude": "39.482796"  }, {    "id": "26",    "category": "6",    "campus_location": "c3",    "title": "percopo hall",    "description": "<p>percopo hall</p>",    "longitude": "-87.328182",    "latitude": "39.482121"  }, {    "id": "27",    "category": "6",    "campus_location": "g3",    "title": "public safety office",    "description": "<p>the office of public safety</p>",    "longitude": "-87.320377",    "latitude": "39.48191"  }, {    "id": "28",    "category": "1",    "campus_location": "e2",    "title": "rotz mechanical engineering lab",    "description": "<p>rotz lab</p>",    "longitude": "-87.323247",    "latitude": "39.483711"  }, {    "id": "28",    "category": "6",    "campus_location": "c2",    "title": "scharpenberg hall",    "description": "<p>scharpenberg hall</p>",    "longitude": "-87.328139",    "latitude": "39.483582"  }, {    "id": "29",    "category": "6",    "campus_location": "g2",    "title": "sigma nu fraternity",    "description": "<p>the sigma nu house</p>",    "longitude": "-87.31999",    "latitude": "39.48374"  }, {    "id": "30",    "category": "6",    "campus_location": "e4",    "title": "south campus / rose-hulman ventures",    "description": "<p></p>",    "longitude": "-87.330623",    "latitude": "39.417646"  }, {    "id": "31",    "category": "6",    "campus_location": "c3",    "title": "speed hall",    "description": "<p>speed hall</p>",    "longitude": "-87.326632",    "latitude": "39.482121"  }, {    "id": "32",    "category": "3",    "campus_location": "c1",    "title": "sports , recreation center",    "description": "<p></p>",    "longitude": "-87.3272",    "latitude": "39.484874"  }, {    "id": "33",    "category": "6",    "campus_location": "f2",    "title": "triangle fraternity",    "description": "<p>triangle fraternity</p>",    "longitude": "-87.32113",    "latitude": "39.483659"  }, {    "id": "34",    "category": "6",    "campus_location": "b3",    "title": "white chapel",    "description": "<p>the white chapel</p>",    "longitude": "-87.329367",    "latitude": "39.482481"  }, {    "id": "35",    "category": "6",    "campus_location": "f2",    "title": "women's fraternity housing",    "description": "",    "image": "",    "longitude": "-87.320753",    "latitude": "39.482401"  }, {    "id": "36",    "category": "3",    "campus_location": "e1",    "title": "intramural fields",    "description": "<p></p>",    "longitude": "-87.321267",    "latitude": "39.485934"  }, {    "id": "37",    "category": "3",    "campus_location": "a3",    "title": "james rendel soccer field",    "description": "<p></p>",    "longitude": "-87.332135",    "latitude": "39.480933"  }, {    "id": "38",    "category": "3",    "campus_location": "b2",    "title": "art nehf field",    "description": "<p>art nehf field</p>",    "longitude": "-87.330923",    "latitude": "39.48022"  }, {    "id": "39",    "category": "3",    "campus_location": "b2",    "title": "women's softball field",    "description": "<p></p>",    "longitude": "-87.329904",    "latitude": "39.480278"  }, {    "id": "40",    "category": "3",    "campus_location": "d1",    "title": "joy hulbert tennis courts",    "description": "<p>the joy hulbert outdoor tennis courts</p>",    "longitude": "-87.323767",    "latitude": "39.485595"  }, {    "id": "41",    "category": "6",    "campus_location": "b2",    "title": "speed lake",    "description": "",    "image": "",    "longitude": "-87.328134",    "latitude": "39.482779"  }, {    "id": "42",    "category": "5",    "campus_location": "f1",    "title": "recycling center",    "description": "",    "image": "",    "longitude": "-87.320098",    "latitude": "39.484593"  }, {    "id": "43",    "category": "1",    "campus_location": "f3",    "title": "army rotc",    "description": "",    "image": "",    "longitude": "-87.321342",    "latitude": "39.481992"  }, {    "id": "44",    "category": "2",    "campus_location": "  ",    "title": "self made man",    "description": "",    "image": "",    "longitude": "-87.326272",    "latitude": "39.484481"  }, {    "id": "p1",    "category": "4",    "title": "percopo parking",    "description": "",    "image": "",    "longitude": "-87.328756",    "latitude": "39.481587"  }, {    "id": "p2",    "category": "4",    "title": "speed parking",    "description": "",    "image": "",    "longitude": "-87.327361",    "latitude": "39.481694"  }, {    "id": "p3",    "category": "4",    "title": "main parking",    "description": "",    "image": "",    "longitude": "-87.326245",    "latitude": "39.481446"  }, {    "id": "p4",    "category": "4",    "title": "lakeside parking",    "description": "",    "image": "",    "longitude": "-87.330848",    "latitude": "39.483284"  }, {    "id": "p5",    "category": "4",    "title": "hatfield hall parking",    "description": "",    "image": "",    "longitude": "-87.321417",    "latitude": "39.482398"  }, {    "id": "p6",    "category": "4",    "title": "women's fraternity parking",    "description": "",    "image": "",    "longitude": "-87.320977",    "latitude": "39.482315"  }, {    "id": "p7",    "category": "4",    "title": "myers , facilities parking",    "description": "",    "image": "",    "longitude": "-87.322243",    "latitude": "39.48417"  }, {    "id": "p8",    "category": "4",    "title": "",    "description": "",    "image": "",    "longitude": "-87.323241",    "latitude": "39.484758"  }, {    "id": "p9",    "category": "4",    "title": "",    "description": "",    "image": "",    "longitude": "-87.323617",    "latitude": "39.484311"  }, {    "id": "p10",    "category": "4",    "title": "",    "description": "",    "image": "",    "longitude": "-87.325714",    "latitude": "39.484584"  }, {    "id": "p11",    "category": "4",    "title": "",    "description": "",    "image": "",    "longitude": "-87.32778",    "latitude": "39.484145"  }, {    "id": "p12",    "category": "4",    "title": "",    "description": "",    "image": "",    "longitude": "-87.329035",    "latitude": "39.4848"  }];    (i = 0; < locations.length; i++) {      var marker = new google.maps.marker({      position: new google.maps.latlng(locations[i].latitude, locations[i].longitude),      title: locations[i].title,      map: map    });    gmarkers.push(marker);    google.maps.event.addlistener(marker, 'click', (function(marker, i) {      return function() {        if (locations[i].description !== "" || locations[i].title !== "") {          infowindow.setcontent('<div class="content" id="content-' + locations[i].id +            '" style="max-height:300px; font-size:12px;"><h3>' + locations[i].title + '</h3>' +            '<hr class="grey" />' +            hasimage(locations[i]) +            locations[i].description) + '</div>';          infowindow.open(map, marker);        }      }    })(marker, i));  }    function togglemarkers() {    (i = 0; < gmarkers.length; i++) {      if (gmarkers[i].getmap() != null) gmarkers[i].setmap(null);      else gmarkers[i].setmap(map);    }  }    function hasimage(location) {    return '';  }
html,  body,  #map {    height: 100%;    width: 100%;  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <script src="http://maps.googleapis.com/maps/api/js"></script>  <div id="controls">    <input type="button" value="toggle markers" onclick="togglemarkers()" />  </div>  <div id="map"></div>


Comments

Popular posts from this blog

c# - Operator '==' incompatible with operand types 'Guid' and 'Guid' using DynamicExpression.ParseLambda<T, bool> -