whoiskatrin whoiskatrin - 4 months ago 56
Javascript Question

setMap is not working

Feel that understood a lot, but stuck again on new item..

I'm trying to delete marker from the map created with Google Map API.

I have a Delete marker button inside the infoWindow.

enter image description here

There is my code below:

function DeleteMarker(index) {

console.log(JSON.stringify(markers[index]));
markers[index].setMap(null); // problem is here
// - setMap is not a function
markers[index] = null;
}


GMaps.on('click',
map.map,
function(event) {

markers.push(new Point(map.markers.length, event.latLng.lat(), event.latLng.lng()));

var index = map.markers.length;
var lat = event.latLng.lat();
var lng = event.latLng.lng();
map.addMarker({
lat: lat,
lng: lng,
title: 'marker' + index,
infoWindow: {
content: '<p>Details:'
+ '<p>Latitude:' + event.latLng.lat() + '</p>'
+ '<p>Longitude:' + event.latLng.lng() + '</p>'+
'<button id ="btnDeleteMarker" onclick=DeleteMarker(\'' + index + '\')>Delete this stop</button>'
}
});
console.log(JSON.stringify(markers));
map.markers[index].infoWindow.open(map.map, map.markers[index]);
});


What is wrong? What should I know to use it in a proper way?

Answer

From what I read on the Google Map API documentation, you have to remove the marker from the markers array too.

What I would try, is:

  • clear all markers from the map
  • remove that marker index
  • and then re-draw the markers from what's left in the array.

It would look like this:

function DeleteMarker(index) {

    console.log( JSON.stringify(markers[index]) );

    setMapOnAll(null);                  // Clear all markers from the map

    var tempArray = markers;            // Create a temporary array
    unset( tempArray[index] );          // Unset the marker to remove
    markers = array_values(tempArray);  // refresh the markers array

    setMapOnAll(map);                   // Show all markers on the map

}

I did not test this... I would have to create a map for it.
But I will if the above code fails.
;)