未捕获的TypeError:无法读取null的属性“name”

时间:2012-05-25 07:48:07

标签: javascript google-maps google-maps-api-3 google-places-api

我正在使用Google Maps和Places API获取地点列表并将其添加到地图中。当您单击其中一个标记时,会出现一个信息窗口,允许用户查看地点的名称,联系方式等。对于大约60%的标记,一切正常,但对于其他40%,信息窗口不会出现。看看javascript错误,我看到了这个:

Uncaught TypeError: Cannot read property 'name' of null.

这是我创建信息窗口的代码:

function createMarker(place) {
  var placeLoc = place.geometry.location;
  var marker = new google.maps.Marker({
    map: map,
    position: place.geometry.location
  });
  var one = 1;
  var two = 2;

  var request = { reference: place.reference };
  service.getDetails(request, function(details, status) {
    google.maps.event.addListener(marker, 'click', function() {
      infowindow.setContent(
        details.name + "<br />"
        + details.formatted_address + "<br />"
        + "<a target='_blank' href='" + details.website +"'>Visit Website</a>" + "<br />"
        + details.formatted_phone_number + "<br />"
        + "<a href='#' onclick='getDirections(" + details.geometry.location.toUrlValue() 
        + "," + location1 + "); return false;'>Directions from Marker One</a>" + "<br />"
        + "<a href='#' onclick='getDirections2(" + details.geometry.location.toUrlValue()
        + "," + location2 + "); return false;'>Directions from Marker Two</a>" + "<br />"
      );
      infowindow.open(map, this);
    });
  });
}

我真的不明白这个错误。当然,谷歌存储的所有地方都必须有一个名字?!

为了记录,我查看了Google地方信息。 Maps API文档,我找不到任何有用的东西。

任何帮助都会非常感谢。

更新:

所以我按照建议记录了控制台中的位置。对于我正在进行的示例测试,它在我的地图上创建了20个标记。在20中,只创建了8个,单击时显示信息窗口,其他12个返回上面列出的错误。正如我所料,所有20个地方都已经打印到控制台,所有这些都是对象,它们看起来都是一样的。下面我列出了在控制台中打印的可点击的内容以及未点击的内容。

可点击:

Object
geometry: Object
html_attributions: Array[0]
icon: "http://maps.gstatic.com/mapfiles/place_api/icons/bar-71.png"
id: "97df16ee5e8d0d9e0c337f52b66dd85ae44de298"
name: "Red Lion"
rating: 3.3
reference: "CnRmAAAA1Oe3LpGcT2zpHUgRq4jfsx-QsnpgUlPKKhVhBL0AVjY1BNKJiscqTbxl-25alM_DJzTIjJTeIkpuVKL0CHkxgBc_nLKNddOkKv6EICQymo7etn-MVY4h06bTKUBwSjIfH30vbNSgCeiv3Cfzy27eORIQrUUJ4nStEjkCI2fJMTaVsRoUHI04xFPDfej3xHC17nJH2mBNBzg"
types: Array[3]
vicinity: "Little Missenden, Amersham"
__proto__: Object

不可点击:

Object
geometry: Object
html_attributions: Array[0]
icon: "http://maps.gstatic.com/mapfiles/place_api/icons/bar-71.png"
id: "01128746c46a52d9a215d3d6a01c11e22f1a49be"
name: "The Full Moon"
rating: 3.9
reference: "CnRrAAAAWDw84_G5mLrNQxd1b14uVsPhw6LmR6sXdvDrJqSDqnMUSzj88n1TImyictRtxtI6_mQz5YXyiBDWM5Un74MoCH06On5kf5JDw6RM3le2SDUcqyZO04NhqwyeBT267ctu91I74hTJmx_VGgqEpXe0HxIQhErbCKXmDJU2yaVmtltITxoUOi4OrxKU9fPGoBiYAn3NGmNpcn8"
types: Array[2]
vicinity: "Hare Lane, Little Kingshill, Great Missenden"
__proto__: Object

我也试过删除所有不必要的代码。

可能值得注意的是,控制台中打印的某些属性可以进一步扩展,不确定它是否相关,所以我没有为示例执行此操作。如果有人认为它是相关的,我可以在以后添加更新的。

感谢目前为止的所有回复。

JA

1 个答案:

答案 0 :(得分:0)

detailsnull,因此您的请求即place.reference存在问题。将place记录到控制台并打开它以查看其中的内容 - 如果有的话。