Question

I am attempting to remove the custom icons from the google map and reset the map to the default zoom and lat lng.

here is my function:

function clearLocations() {
 infoWindow.close();
 for (var i = 0; i < markers.length; i++) {
   markers[i].setMap(null);
 }
 markers.length = 0; 
 sidebar.innerHTML = "";
 map.setCenter(new google.maps.LatLng(36.1611, -116.4775), 6);
}

the map will reset to the default latlng, zoom level stays the same, and the sidebar htmk us removed. however the icons stay on the map. not undestanding why this is ocurring.
many thanks,
–matt

EDIT — my apologies for not including the markers

function createMarker(latlng, name, address, city, state, zipcode, telephone, images, url) { 
  var html = "<div>stuff here</div>";
  var marker = new google.maps.Marker({
    icon: icon, 
    map: map, 
    position: latlng 
  });

  google.maps.event.addListener(marker, 'click', function() {
    infoWindow.setContent(html);
    infoWindow.open(map, marker);
  });
  return marker;
}

Answer 1

You need to put your makers in the markers array which is later cleared by the loop in clearLocations(). markers array should be global

     //global variable
        var markers = [];
        function createMarker(latlng, name, address, city, state, zipcode, telephone, images, url) { 
          var html = "<div>stuff here</div>";
          var marker = new google.maps.Marker({
            icon: icon, 
            map: map, 
            position: latlng 
          });
//add current marker to markers array
        markers.push(marker);

          google.maps.event.addListener(marker, 'click', function() {
            infoWindow.setContent(html);
            infoWindow.open(map, marker);
          });
          return marker;
        }