未被捕获的TypeError:无法读取null的属性"length" [英] Uncaught TypeError: Cannot read property 'length' of null
本文介绍了未被捕获的TypeError:无法读取null的属性"length"的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我为此模块使用了Google Map javascript V3 API. 直到我们不拖动地图，此代码才能正常工作，但是当我拖动地图时，我将收到"Uncaught TypeError:无法读取属性'length'为null的空值"(来自Google chrome inspect元素)
I used google map javascript V3 API for this module. This code working fine untill we don't drag the map, but when i drag the map i'll get "Uncaught TypeError: Cannot read property 'length' of null "(from google chrome inspect element)
代码:
<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>
推荐答案
您没有检查场所搜索的返回状态.如果遇到错误(或不返回任何结果)，它将失败.
You aren't checking the return status of the places search. If it encounters an error (or doesn't return any results), it will fail.
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"); }
}
这篇关于未被捕获的TypeError:无法读取null的属性"length"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
