允许用户在网站中输入他的位置（地址）答案

【问题标题】：Allow user to enter his location (address) in website允许用户在网站中输入他的位置（地址）
【发布时间】：2024-01-04 17:42:01
【问题描述】：

我在一个拥有多家公司和员工的网站上工作，每家公司都应通过在 Google 地图上输入其用户名、密码和位置进行注册。
该位置将出现在使用 android 应用程序（连接到同一网站的数据库）的员工身上。

我想知道如何允许公司通过键入位置的小数点或通过使用 pin 在 Google 地图上指定它或允许我检测他们的位置来指定他们的确切地址。我读到这个：https://developers.google.com/maps/documentation/javascript/tutorial 但我不知道这是否是我需要的。

请注意，这是我第一次处理地图，所以我并不深入。

【问题讨论】：

这有点宽泛。也许您可以将您的问题仅限于一种定位技术？
@RobertHarvey 我不介意使用任何技术。
好的。你想用哪一个？
@RobertHarvey 我想我会选择最简单的一个，如果它们都相等，将使用检测当前位置。

标签： javascript google-maps google-maps-api-3 geolocation location

【解决方案1】：

我希望我能正确理解你。

一个选项可能是这样的：

获取用户设备的地理位置并将该位置放置在带有可拖动标记的地图上。如果位置不正确，可以拖动标记，如果标记位置已更改，您将获得新坐标。

这是代码（使用 jquery）：

var map;
var marker;

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

  // Try HTML5 geolocation
  if(navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      var pos = new google.maps.LatLng(position.coords.latitude,
                                       position.coords.longitude);
      var marker = new google.maps.Marker({
      position: pos,
      map: map,
      title: 'Here you are',
      draggable: true
      });

    $('#user-info').append('Location found using HTML5<br/>');
      map.setCenter(pos);
        google.maps.event.addListener(marker, 'dragend', function(a) {
     $('#user-info').append(a.latLng.lat().toFixed(4) + ', ' + a.latLng.lng().toFixed(4) +'<br/>' );
    });
    }, function() {
      handleNoGeolocation(true);
    });
  } else {
    // Browser doesn't support Geolocation
    handleNoGeolocation(false);
  }
}

function handleNoGeolocation(errorFlag) {
  if (errorFlag) {
    $('#user-info').append('Error: The Geolocation service failed.');
  } else {
     $('#user-info').append('Error: Your browser doesn\'t support geolocation.');
  }

  var options = {
    map: map,
    position: new google.maps.LatLng(60, 105),
    };

  map.setCenter(options.position);
}

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

http://jsfiddle.net/iambnz/xdoc1nxm/

我希望这会对你有所帮助。如果您需要获取确切的地址，则必须添加地理编码功能。

【讨论】：