Hiding markers Google Maps API v3 with a click

446 Views Asked by At

I want to hide marker with a click on a link HTML. I've written some code, but it's not working. Can somebody tell me what's wrong?

var markers = [];

var cuicui= [
     [45.710743, 4.934347],     
     [45.691894, 4.923193],
     [45.713855, 4.928156],
     [45.710238, 4.965208],
     [45.713550, 4.930187],
     [45.712871, 4.928613],
     [45.698959, 4.918937],
     [45.709566, 4.923370],
     [45.715945, 4.931199],
     [45.715824, 4.912740]
];

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

    markers.push(marker);

    google.maps.event.addListener(marker, 'click', (function(marker, i) {
      })(marker, i));   

    marker.setVisible(false);

    google.maps.event.addDomListener(document.getElementById('cuicui'), 'click', function () {
      if (marker.setVisible(false)) {
          marker.setVisible(true);
        } else {
          marker.setVisible(false);
        }
    });
} 

And in my HTML I have:

  <a style="cursor : pointer;" id="cuicui">Ici</a>

(Sorry for my English.)

1

There are 1 best solutions below

1
On

Instead of setVisible(); use setMap();

marker.setMap(map);

to make it appear and

marker.setMap(null);

to make it invisible