未捕获的TypeError：无法设置undefined的属性“position”

I have this code giving me the strange error message

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

Uncaught TypeError: Cannot set property 'position' of undefined

This is the inside of a jQuery plugin to show a google map in a popup. I was using the code somewhere else, where it worked fine - the only difference here seems to be that I'm now using it in a Popup window. Am I missing a scope issue or something? All the variables like geocoderParams and latlng are filled like they should. Googling the the error message turned up nothing valuable.

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

The error message gets fired when the google.maps.Map() is called.

调用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()

3 个解决方案

#1

I looked up google.maps.Map() and the Google reference says that the first parameter should be a mapDiv:Node which is the container for the map and is typically a div element.

我查了google.maps.Map（），Google引用说第一个参数应该是mapDiv：Node，它是地图的容器，通常是div元素。

You are passing $(this) which is likely a jQuery object which is not what Google maps is expecting. I don't know the rest of your code, but perhaps you should just be passing this instead of $(this).

你正在传递$（this），这可能是一个jQuery对象，而不是谷歌地图所期望的。我不知道你的其余代码，但也许你应该传递这个而不是$（this）。

#2

If you're using jQuery, you need to pass the vanilla HTMLElement (e.g. Node) instead of the jQuery selection (e.g. Array/NodeList) which the $() query returns.

如果你正在使用jQuery，你需要传递vanilla HTMLElement（例如Node）而不是$（）查询返回的jQuery选择（例如Array / NodeList）。

if you add a console command:

如果添加控制台命令：

console.log(self);

it will return something like:

它将返回如下内容：

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

to get the value from the jQuery array, replace:

要从jQuery数组中获取值，请替换：

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

with:

有：

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

#3

I encountered this error when trying to initiate the map with something like this:

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

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

I was able to solve it by selecting the first (and only) item that the selector returns by adding [0] after the selector:

通过在选择器后添加[0]选择第一个（也是唯一的）选择器返回的项目，我能够解决它：

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

#1