删除标记-Google Maps Javascript API v3

Question

Trying out tha Maps API. I got stuck at removing markers. Adding Marker works great, but deletion isnt working. Any idea why this would not work? Thank in advance!

function placeMarker(event) {
    var marker = new google.maps.Marker({
      clickable: true,
      position: event.latLng,
      map: map
    });
  }

  function deleteMarker() {
    marker.setMap(null);
    marker = null;
  }

   function initialize() {
    var mapOptions = {
      zoom: 8,
      center: home
    };
    map = new google.maps.Map(document.getElementById('map-canvas'),
        mapOptions);

    google.maps.event.addListener(map,'rightclick', placeMarker);
    google.maps.event.addListener(marker,'click', deleteMarker);
  }

  google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

Defining global variables

var map,
    marker,
    home = new google.maps.LatLng(46.5, 13.5);

results in error message:

Uncaught TypeError: Cannot read property '__e3_' of undefined      main.js:15

from line

google.maps.event.addListener(marker, 'click', deleteMarker);

marker is still undefined because it is not created and event listener cannot be attached to it. That line has to be moved to placeMarker() function:

function placeMarker(event) {
    marker = new google.maps.Marker({
        clickable: true,
        position: event.latLng,
        map: map
    });

    google.maps.event.addListener(marker, 'click', deleteMarker);
}

See example at jsbin .