如何使用地理位置获取文本框中的当前位置?

时间:2016-05-08 19:15:18

标签: javascript html asp.net google-maps geolocation

当我拖动标记时,我的地图仅在文本框中输入地址。但我希望一旦页面加载发生,当前跟踪的位置就会显示在文本框中。我无法这样做。这是我的代码

代码:

  var geocoder;

  function initMap() {
  geocoder = new google.maps.Geocoder();
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(showPosition, showError);
   } else {
    x = document.getElementById("ContentPlaceHolder1_txtLoc");
    x.innerHTML = "Geolocation is not supported by this browser.";
  }

   function showError(error) {
    x = document.getElementById("ContentPlaceHolder1_txtLoc");
    switch (error.code) {
        case error.PERMISSION_DENIED:
            x.innerHTML = "User denied the request for Geolocation."
            break;
        case error.POSITION_UNAVAILABLE:
            x.innerHTML = "Location information is unavailable."
            break;
        case error.TIMEOUT:
            x.innerHTML = "The request to get user location timed  out."
            break;
        case error.UNKNOWN_ERROR:
            x.innerHTML = "An unknown error occurred."
            break;
    }
   }



//updateMarkerPosition(latlon);
//geocodePosition(latlon);
 }

  function geocodePosition(pos) {
 x = document.getElementById("ContentPlaceHolder1_txtLoc");
  geocoder.geocode({ 'latLng': pos }, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK) {
        if (results[0]) {
            x.innerHTML = results[0].formatted_address;
            y = document.getElementById("ContentPlaceHolder1_txtLoc");
            y.value = results[0].formatted_address;


        }
    } else {
        x.innerHTML = "Geocoder non possibile";
    }
   });

  }

 function showPosition(position) {
 lat = position.coords.latitude;
 lon = position.coords.longitude;
 latlon = new google.maps.LatLng(lat, lon)
 mapholder = document.getElementById('map')

    var myOptions = {
    center: latlon,
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    mapTypeControl: false,
    navigationControlOptions:
    { style: google.maps.NavigationControlStyle.SMALL }
 }

 var contentString = 'Drag red marker <br/> to improve geo-location';
 var infowindow = new google.maps.InfoWindow({
    content: contentString
 });
infowindow.open(map, marker);

 var map = new google.maps.Map(document.getElementById("map"), myOptions);
 var marker = new google.maps.Marker({
    position: latlon,
    map: map,
    title: 'Report refers to this location',
    draggable: true
});


// Add dragging event listeners.
google.maps.event.addListener(marker, 'dragstart', function (evt) {
    x = document.getElementById("ContentPlaceHolder1_txtLoc");
    x.innerHTML = '<p>Dragging ... Marker dropped: Current Lat: ' +       evt.latLng.lat() + ' Current Lng: ' + evt.latLng.lng() + '</p>';
});

google.maps.event.addListener(marker, 'drag', function (evt) {
    x = document.getElementById("ContentPlaceHolder1_txtLoc");
    x.innerHTML = '<p>Dragging ... again .... Marker position: Current Lat: ' + evt.latLng.lat() + ' Current Lng: ' + evt.latLng.lng() + '</p>';
});

google.maps.event.addListener(marker, 'dragend', function (evt) {
    x = document.getElementById("ContentPlaceHolder1_txtLoc");
     x.innerHTML = '<p>Drag .. ended ... Marker dropped: Current Lat: '
   +   evt.latLng.lat() + ' Current Lng: ' + evt.latLng.lng() + '</p>';
    geocodePosition(marker.getPosition());
  });

 } 

0 个答案:

没有答案