title: set marker google maps javascript api
body: <p>I am trying to create with the google maps javascript api the following: After page loading a marker should become set at the users location, what now works. After that should where the user click on the map a marker become added and the previous one deleted. One marker should be only on the map. Now the previous marker wont become deleted and other become added what I dont want. What can I do to have always one marker on the map? </p>
  
  <pre><code>var markers = [];
      function initMap() {
        var map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: -34.397, lng: 150.644},
          zoom: 7
        });
        var infoWindow = new google.maps.InfoWindow({map: map});
  
        // Try HTML5 geolocation.
        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
            var pos = {
              lat: position.coords.latitude,
              lng: position.coords.longitude
            };
  
            map.setCenter(pos);
  
  
        // This event listener will call addMarker() when the map is clicked.
        map.addListener('click', function(event) {
          deleteMarkers();
  addMarkers(event.latLng);
  
  
        });
        addMarkers(pos);
        // Adds a marker to the map and push to the array.
        function addMarkers(location) {
        var marker = new google.maps.Marker({
          position: location,
          map: map
        });
        markers.push(marker);
      }
    // Sets the map on all markers in the array.
    function setMapOnAll(map) {
    for (var i = 0; i &lt; markers.length; i++) {
      markers[i].setMap(map);
    }
  }
  // Removes the markers from the map, but keeps them in the array.
  function clearMarkers() {
    setMapOnAll(null);
  }
  
  
      // Deletes all markers in the array by removing references to them.
      function deleteMarkers() {
          clearMarkers();
        marker = [];
      }
  
  
          }, function() {
            handleLocationError(true, infoWindow, map.getCenter());
          });
  
        } else {
          // Browser doesn't support Geolocation
          handleLocationError(false, infoWindow, map.getCenter());
        }
  
      }
  </code></pre>