2012-02-10 122 views
3

我的地圖工作正常;繪製帶有半徑圓圈的標記,並在infoWindows上單擊顯示。然後突然沒有。Google Maps API v3標記和圓圈突然停止顯示

  • 我經歷了git歷史並且沒有對代碼進行任何更改。
  • 它既不在本地工作也不部署到公共領域。
  • 沒有JS錯誤。
  • 這些地址正在進行正確的地理編碼。
  • 地圖本身呈現。
  • 我低於費率限制。
  • 我檢查了Google Maps API更新日誌,但沒有看到任何相關內容。

有人請找到我沒有看到什麼!

<!doctype html> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <title></title> 
     <style> 
      #map_canvas { 
       width:1000px; 
       height:700px; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="map_canvas"></div> 
     <script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
     <script> 

      var addresses = ["117 Balsam Avenue,Hamilton,Ontario,Canada,L8M 3B4", "47 East Avenue,Hamilton,Ontario,Canada,L8L 5H4"]; 
      var map; 
      var infoWindow; 

      function encodeAddresses(addresses, callback) { 
       var geocoder = new google.maps.Geocoder(); 
       for (var i = 0; i < addresses.length; i++) { 
        geocoder.geocode({ 
         'address' : addresses[i] 
        }, function (results, status) { 
         if (status === google.maps.GeocoderStatus.OK) { 
          var lat = results[0].geometry.location.Qa; 
          var long = results[0].geometry.location.Pa; 
          var address = results[0].formatted_address; 
          addCircleToMap(lat, long, address); 
          addMarkerToMap(lat, long, address); 
         } 
        }); 
       } 
      } 

      function addCircleToMap(lat, long, address) { 
       var options = { 
        strokeColor : "#4EA429", 
        strokeOpacity : 0.8, 
        strokeWeight : 1, 
        fillColor : "#4EA429", 
        fillOpacity : 0.35, 
        map : map, 
        center : new google.maps.LatLng(lat, long), 
        radius : 1000, 
        address : address 
       }; 
       var propertyRadius = new google.maps.Circle(options); 
       google.maps.event.addListener(propertyRadius, 'click', showInfo); 
      } 

      function showInfo(e) { 
       infoWindow.setContent(this.address + "<br />(1000m/3280ft radius)"); 
       infoWindow.setPosition(e.latLng); 
       infoWindow.open(map); 
      } 

      function addMarkerToMap(lat, long, address) { 
       new google.maps.Marker({ 
        title : address, 
        map : map, 
        position : new google.maps.LatLng(lat, long) 
       }); 
      } 

      function renderMap() { 
       var mapContainer = document.getElementById("map_canvas"); 
       var mapOptions = { 
         zoom : 9, 
         center : new google.maps.LatLng(43.645004, -79.380707), 
         mapTypeId : google.maps.MapTypeId.ROADMAP 
        }; 
       adjustMapContainerHeight(mapContainer); 
       map = new google.maps.Map(mapContainer, mapOptions); 
       infoWindow = new google.maps.InfoWindow(); 
      } 

      function adjustMapContainerHeight(element) { 
       element.style.height = (document.height - 90) + "px"; 
      } 

      function getCurrentPosition(defaultLatitude, defaultLongitude, callback) { 
       var currentPosition = {}; 
        currentPosition.latitude = defaultLatitude; 
        currentPosition.longitude = defaultLongitude; 
       if (navigator.geolocation) { 
        navigator.geolocation.getCurrentPosition(
         function (position) { 
         currentPosition.latitude = position.coords.latitude; 
         currentPosition.longitude = position.coords.longitude; 
        }, 
         function (error) {}); 
       } 
       callback(currentPosition); 
      } 

      getCurrentPosition(43.645004, -79.380707, renderMap); 
      encodeAddresses(addresses, addCircleToMap); 

     </script> 
    </body> 
</html> 

回答

3

一旦試圖更改以下行encodeAddresses() function.Its在我的機器做工精緻與變化:

var lat = results[0].geometry.location.Pa;  
var long = results[0].geometry.location.Qa; 

您正在使用PalongQalat這不是谷歌支持one.So改變這兩條線並檢查。

希望這有助於你:-)

+0

非常感謝。 – nbsp 2012-02-10 20:50:23

+0

歡迎您:-) – Unknown 2012-02-11 05:09:44

1

您正在使用與該API的各個版本而無證領域。

LatLng對象上使用lat()lng()方法。

請參閱reference documentation