Remove google maps markers that are in object array

Question

I have markers that are stored in an object array and I cannot figure out how to delete them.

// Initialize Object Array
var Calls = [{
  lat: 42,
  lng: -72
}, {
  lat: 40.7127837,
  lng: -74.0059413
}, {
  lat: 40.735657,
  lng: -74.1723667
}];

// Initialize Map
function initMap()
{
    map = new google.maps.Map(document.getElementById('map'),
    {
        center: Calls[0],
        zoom: 14,
        scaleControl: true
    })
}

// Add Markers
function initMarkers()
{
    for (var i = 0; i < Calls.length; i++)
    {
        var marker = new google.maps.Marker({
            position: Calls[i],
            map: map
        });
    }
}

// Start on Load
window.onload = function()
{
    initMap();
    initMarkers();
}

//Clear Markers
function clearOverlays()
{
    initMarkers(null);
}

// Run Clear Markers Function every 3 seconds
setInterval(function()
{
    clearOverlays();
    Calls = [];
}, 3000)

possible duplicate of [Google Maps API v3: How to remove all markers?](http://stackoverflow.com/questions/1544739/google-maps-api-v3-how-to-remove-all-markers) — geocodezip, Nov 25 '15 at 14:54
related question: [Trying to remove markers from map](http://stackoverflow.com/questions/21656232/trying-to-remove-markers-from-map) — geocodezip, Nov 25 '15 at 14:59
possible duplicate of [Google Map V3 Remove Markers before updating](http://stackoverflow.com/questions/19861837/google-map-v3-remove-markers-before-updating) — geocodezip, Nov 25 '15 at 15:00
related question: [Google Maps API v3 & AJAX - Removing markers](http://stackoverflow.com/questions/30080581/google-maps-api-v3-ajax-removing-markers) — geocodezip, Nov 25 '15 at 15:02
I already looked at all of those and decided to ask my own question either because I didn't understand their example since it had overhead code I didn't use or it didn't relate to my situation as it ties in with my asp project. — Mr.Smithyyy, Nov 25 '15 at 15:02
I'm not sure if you're just searching and copy pasting the links without looking as some of those links are unrelated and that last one doesn't even have a chosen answer. — Mr.Smithyyy, Nov 25 '15 at 15:03
I looked at all the links, the ones that say possible duplicate have the same problem and a solution that should work (whether it is accepted or not). If you already looked at them, please show that research in your question. Why do you think calling `initMarkers(null)` would do anything useful? That function 1. doesn't take any arguments, 2. creates new markers. — geocodezip, Nov 25 '15 at 15:08
https://developers.google.com/maps/documentation/javascript/examples/marker-remove — Mr.Smithyyy, Nov 25 '15 at 15:13

Zakaria Acharki · Accepted Answer · 2015-11-25T14:55:54.983

Working fiddle.

You have to store markers in other array like :

var markers = [];

for (var i = 0; i < Calls.length; i++)
{
    var marker = new google.maps.Marker({
        position: Calls[i],
        map: map
    });
    markers.push(marker);
}

After that add function that clear map from all markers :

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

Hope this helps.

Remove google maps markers that are in object array

1 Answers1