未捕获的TypeError:无法设置undefined的属性"position"

Question

我有这个代码给我奇怪的错误信息

Uncaught TypeError: Cannot set property 'position' of undefined

这是一个jQuery插件的内部,用于在弹出窗口中显示谷歌地图.我在其他地方使用代码,它工作正常 - 这里唯一的区别似乎是我现在在弹出窗口中使用它.我错过了范围问题吗？像geocoderParams和latlng这样的所有变量都应该填充.谷歌搜索错误消息没有任何价值.

调用google.maps.Map()时会触发错误消息.

self = $(this)
self.hide()

geocoder = new google.maps.Geocoder
geocoderParams =
  address: self.data('address') || settings.address
  region: settings.region

results = geocoder.geocode geocoderParams, (results, status) ->

if status == google.maps.GeocoderStatus.OK
  latlng = results[0].geometry.location

  mapOptions =
    mapTypeControl: false
    overviewMapControl: false
    zoom: settings.zoomLevel
    center: latlng
    mapTypeId: google.maps.MapTypeId.ROADMAP

  map = new google.maps.Map(self, mapOptions)

self.show()

Answer 1

我查了一下google.maps.Map(),谷歌参考说明第一个参数应该是mapDiv:Node地图的容器,通常是一个div元素.

你传递$(this)的可能是一个jQuery对象,这不是谷歌地图所期望的.我不知道你的其余代码,但也许你应该只是通过this代替$(this).

Answer 2

如果你正在使用jQuery,你需要传递vanilla HTMLElement(例如Node)而不是查询返回的jQuery选择(例如Array/ NodeList)$().

如果添加控制台命令:

console.log(self);

它将返回如下内容:

[ ? <div id="map_canvas"></div> ]

要从jQuery数组中获取值,请替换:

map = new google.maps.Map(self, mapOptions)

有:

map = new google.maps.Map(self[0], mapOptions)

Answer 3

尝试使用以下内容启动地图时遇到此错误:

map = new google.maps.Map($('#map-canvas'), mapOptions);

我能够通过在选择器[0]后面添加选择器返回的第一个(也是唯一的)项来解决它:

map = new google.maps.Map($('#map-canvas')[0], mapOptions);