javascript - Google 在我的位置上映射 api v3 标准标记

Question

当我在当前位置打开我的谷歌地图页面时，我想设置一个标记。当我在文本字段中输入地址时，需要更改此标记。我不知道如何在我的位置上添加标准标记并在文本字段中输入地址时更新它。

我已经有了当前位置的经纬度。

<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"
  type="text/javascript"></script>

<style type="text/css">
  body {
    font-family: sans-serif;
    font-size: 14px;
  }
  #map_canvas {
    height: 400px;
    width: 600px;
    margin-top: 0.6em;
  }
</style>

<script type="text/javascript">
var gl;
var ownlat;
var ownlng;

function displayPosition(position) 
{
    ownlat = position.coords.latitude;
    ownlng = position.coords.longitude;
    var p = document.getElementById("p");
    p.innerHTML = "Own Latitude = " + ownlat + " <br/>" +
    "Own Longitude = " + ownlng;
}

function displayError(positionError) 
{
  alert("error " + positionError.code);
}

try 
{
    if (typeof navigator.geolocation === 'undefined')
    {
        gl = google.gears.factory.create('beta.geolocation');
    } else {
        gl = navigator.geolocation;
    }
} catch(e) {}

if (gl) 
{
    gl.getCurrentPosition(displayPosition, displayError);
} else 
{
    alert("Geolocation services are not supported by your web browser.");
} 

  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(-33.8688, 151.2195),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'),
      mapOptions);


    var input = document.getElementById('searchTextField');
    var autocomplete = new google.maps.places.Autocomplete(input);

    autocomplete.bindTo('bounds', map);

    var infowindow = new google.maps.InfoWindow();
    var marker = new google.maps.Marker({
      map: map
    });


    google.maps.event.addListener(autocomplete, 'place_changed', function() {
      infowindow.close();
      var place = autocomplete.getPlace();
      if (place.geometry.viewport) {
        map.fitBounds(place.geometry.viewport);
      } else {
        map.setCenter(place.geometry.location);
        map.setZoom(17);  // Why 17? Because it looks good.
      }   


      var image = new google.maps.MarkerImage(
          place.icon,
          new google.maps.Size(71, 71),
          new google.maps.Point(0, 0),
          new google.maps.Point(17, 34),
          new google.maps.Size(35, 35));
      marker.setIcon(image);
      marker.setPosition(place.geometry.location);

      var address = '';
      if (place.address_components) {
        address = [(place.address_components[0] &&
                    place.address_components[0].short_name || ''),
                   (place.address_components[1] &&
                    place.address_components[1].short_name || ''),
                   (place.address_components[2] &&
                    place.address_components[2].short_name || '')
                  ].join(' ');
      }

      infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address);
      infowindow.open(map, marker);

            //GET LAT & LONG
    var lat = marker.getPosition().lat();
    var long = marker.getPosition().lng();

    document.getElementById('lat').innerHTML = lat;
    document.getElementById('long').innerHTML = long;
    });

    // Sets a listener on a radio button to change the filter type on Places
    // Autocomplete.
    function setupClickListener(id, types) {
      var radioButton = document.getElementById(id);
      google.maps.event.addDomListener(radioButton, 'click', function() {
        autocomplete.setTypes(types);
      });
    }

    setupClickListener('changetype-all', []);
    setupClickListener('changetype-establishment', ['establishment']);
    setupClickListener('changetype-geocode', ['geocode']);
  }
  google.maps.event.addDomListener(window, 'load', initialize);     
</script>