允许用户在网站中输入他的位置(地址)

时间:2014-09-27 17:26:32

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

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

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

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

1 个答案:

答案 0 :(得分: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/

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