Question

我的代码是通过点击按钮在谷歌地图上找到用户的当前位置标记，地理编码功能将收到地址信息。

如何使地址取当前位置值而不是输入值？

<body>
  <div id="panel">
      <input id="city_country" type="textbox" value="Berlin, Germany">
      <input type="button" value="Geocode" onclick="codeAddress()">
  </div>  
  <div id="mapCanvas"></div>
  <div id="infoPanel">
    <b>Marker status:</b>
    <div id="markerStatus"><i>Click and drag the marker.</i></div>
    <b>Current position:</b>
    <div id="info"></div>
    <b>Closest matching address:</b>
    <div id="address"></div>
  </div>
</body>


//js 

var geocoder;
var map;
var marker;

codeAddress = function () {
    geocoder = new google.maps.Geocoder();

  var address = document.getElementById('city_country').value;
  geocoder.geocode( { 'address': address}, function(results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
      map = new google.maps.Map(document.getElementById('mapCanvas'), {
    zoom: 16,
            streetViewControl: false,
          mapTypeControlOptions: {
        style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
              mapTypeIds:[google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.ROADMAP] 
    },
    center: results[0].geometry.location,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });

Answer 1

要从用户获取当前位置，您需要使用地理位置API。请参阅此处的文档：

https://developers.google.com/maps/documentation/javascript/geolocation

if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = {
          lat: position.coords.latitude,
          lng: position.coords.longitude
        };

        infoWindow.setPosition(pos);
        infoWindow.setContent('Location found.');
        infoWindow.open(map);
        map.setCenter(pos);
      }, function() {
        handleLocationError(true, infoWindow, map.getCenter());
      });
    } else {
      // Browser doesn't support Geolocation
      handleLocationError(false, infoWindow, map.getCenter());
    }
  }

您可以使用上面的变量pos来设置标记的位置和地图的中心，而不是像样本中那样的地理编码查询结果。这会使地图围绕用户的位置居中，而不是从文本框中进行地理编码的位置。

我能够使用您提供的JSFiddle以及我自己的一些代码以及我上面链接的地理定位示例。我相信这就是你要找的东西（请注意你需要把自己的API密钥放到这个JSFiddle中才能工作）它会对用户的位置进行地理定位，并允许用户拖动标记并获取地址信息就像你的样本一样。这也将允许用户单击地理编码按钮并仍然具有相同的功能：

https://jsfiddle.net/45z4841z/1/

我希望这有帮助！

找到当前位置标记

1 个答案: