2014-09-24 6 views
-1

Я использовал API-интерфейс google map javascript V3 для этого модуля. Этот код работает нормально до тех пор, пока мы не перетаскиваем карту, но когда я перетаскиваю карту, я получу «Uncaught TypeError: Can not read property» length «null» (из элемента проверки google chrome)Uncaught TypeError: Невозможно прочитать свойство 'length' of null

Код:

<html> 
    <head> 
     <title> 
      Google Search 
     </title> 
     <style type="text/css"> 
      html, body { height: 100%; margin: 0; padding: 0;} 
      #map-canvas { height: 80%; width:80%; margin: auto; padding: 0;} 
     </style> 
     <script src="js/jquery.min.js"></script> 
     <script src="https://maps.googleapis.com/maps/api/js?libraries=places&sensor=false"></script> 
     <script> 
      var map; 
      var service; 

      $(document).ready(function(){ 
       navigator.geolocation.getCurrentPosition(initialize); 
      }); 

      function initialize(location) { 
       console.log(location); 

       var currentlocation = new google.maps.LatLng(location.coords.latitude, location.coords.longitude); 

       var mapOptions = { 
        center: currentlocation , 
        zoom: 12, 
        mapTypeId: google.maps.MapTypeId.ROADMAP, 
        disableDefaultUI: true, 
        draggable: true 
       }; 
       map = new google.maps.Map(document.getElementById("map-canvas"), 
        mapOptions); 

       var marker = new google.maps.Marker({ 
        position: currentlocation, 
        map: map, 
        title:"Hello World!" 
       }); 

       service = new google.maps.places.PlacesService(map); 

       google.maps.event.addListener(map, 'bounds_changed', performSearch); 

       var circleOptions = { 
        strokeColor: '#FF0000', 
        strokeOpacity: 0.8, 
        strokeWeight: 2, 
        fillColor: '#FF0000', 
        fillOpacity: 0.25, 
        map: map, 
        center: currentlocation, 
        radius: 10000 
       }; 

       var circle = new google.maps.Circle(circleOptions); 

      } 

      function performSearch() { 
       var request = { 
        bounds: map.getBounds(), 
        name: "McDonald's" 
       }; 

       service.nearbySearch(request, handleSearchResult); 
      } 

      function handleSearchResult(results, status){ 
       console.log(results); 
       for (var i = 0; i < results.length; i++) { 
        var marker = new google.maps.Marker({ 
         position: results[i].geometry.location, 
         map: map, 
         icon: "images//restaurant-71.png" 
        }); 
       } 
      } 
     </script> 
    </head> 
    <body> 
     <div id="map-canvas"></div> 
    </body> 
</html> 

ответ

1

Вы не проверяете статус возврата поиска мест. Если он сталкивается с ошибкой (или не возвращает никаких результатов), он будет терпеть неудачу.

function handleSearchResult(results, status){ 
    if (status == google.maps.places.PlacesServiceStatus.OK) { 
    for (var i = 0; i < results.length; i++) { 
     var marker = new google.maps.Marker({ 
      position: results[i].geometry.location, 
      map: map, 
      icon: "images//restaurant-71.png" 
     }); 
    } 
    else { alert("no results"); } 
} 

 Смежные вопросы

  • Нет связанных вопросов^_^