谷歌地图和使用html5API反向地理编码？

Question

why does this: 为什么这样做：

        function initCoords() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(initialize, locationError);
  } else {
    showError("Your browser does not support Geolocation!");
  }
}
initCoords();
function locationError(){
  alert('"Your browser does not support Geolocation!"');
}
function initialize(position) {
    lat = position.coords.latitude;
    lon = position.coords.longitude;
    var acc = position.coords.accuracy;
    geocoder = new google.maps.Geocoder();
    // Debugging
    console.log(position.coords);
    console.log("Accuracy: "+acc+"\nLatitude: "+lat+"\nLongitude: "+lon);
    var latlng = new google.maps.LatLng(lat,lon);

    // Google Maps API
    var myLatlng = new google.maps.LatLng(lat,lon);
    var mapOptions = {
        center: latlng,
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
}
  function codeLatLng(position) {
   lat = position.coords.latitude;
    lon = position.coords.longitude;
    var latlng = new google.maps.LatLng(lat, lon);
    geocoder.geocode({'latLng': latlng}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        if (results[1]) {
          map.setZoom(11);
          marker = new google.maps.Marker({
              position: latlng,
              map: map
          });
          infowindow.setContent(results[1].formatted_address);
          infowindow.open(map, marker);
        }
      } else {
        alert("Geocoder failed due to: " + status);
      }
    });
  }
  codeLatLng();

always return this: 总是返回这个：

Uncaught TypeError: Cannot read property 'coords' of undefined

on this line: 在这条线上：

    function codeLatLng(position) {
   lat = position.coords.latitude;
    enter code here

it shows me the map just not the marker with the address... I've also tried this: codeLatLng(position); 它向我显示了地图，而不是带有地址的标记...我也尝试过：codeLatLng（position）;

Answer 1

I moved the call to CodeLatLng() into the Initialize() function after you render the google map, and pass it the position argument. 渲染Google地图后，将对CodeLatLng（）的调用移到Initialize（）函数中，并将其传递给position参数。 See comments above. 见上面的评论。

<html>
<head>
 <script type="text/javascript"      src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
 <script>
 function initCoords() {
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(initialize, locationError);
  } else {
    showError("Your browser does not support Geolocation!");
  }
}
initCoords();
function locationError(){
  alert('"Your browser does not support Geolocation!"');
}
function initialize(position) {
    lat = position.coords.latitude;
    lon = position.coords.longitude;
    var acc = position.coords.accuracy;
    geocoder = new google.maps.Geocoder();
    // Debugging
    console.log(position.coords);
    console.log("Accuracy: "+acc+"\nLatitude: "+lat+"\nLongitude: "+lon);
    var latlng = new google.maps.LatLng(lat,lon);

    // Google Maps API
    var myLatlng = new google.maps.LatLng(lat,lon);
    var mapOptions = {
        center: latlng,
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  codeLatLng( position );
}
  function codeLatLng(position) {
   lat = position.coords.latitude;
    lon = position.coords.longitude;
    var latlng = new google.maps.LatLng(lat, lon);
    geocoder.geocode({'latLng': latlng}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        if (results[1]) {
          map.setZoom(11);
          marker = new google.maps.Marker({
              position: latlng,
              map: map
          });
          infowindow.setContent(results[1].formatted_address);
          infowindow.open(map, marker);
        }
      } else {
        alert("Geocoder failed due to: " + status);
      }
    });
  }
 </script>
 </head>
  <body onload="">
  <div id="map_canvas" style="width: 400px; height: 400px;"></div>
  </body>
  </html>

谷歌地图和使用html5API反向地理编码？

问题描述

1 个解决方案

解决方案1
1 已采纳 2013-12-10 15:13:11

谷歌地图和使用html5API反向地理编码？

问题描述

1 个解决方案

解决方案1 1 已采纳 2013-12-10 15:13:11

解决方案1
1 已采纳 2013-12-10 15:13:11