用户脚本：触发谷歌地图调整大小？

Question

我正在为GeoGuessr.com构建一个用户脚本（脚本在浏览器中安装以修改第三方页面）。它添加了一个按钮，允许将小猜测图扩展到全屏。

虽然我对布局没有任何问题，但问题是Google地图不会调整大小：

该页面是使用Backbone构建的，没有用于访问任何视图的API，更不用说内部Google Maps对象了。

我试过

$(window).trigger('resize');

触发窗口调整大小事件，因为我注意到当我手动执行此操作时，地图会调整大小。但没有任何反应（Chrome 29）。

有没有办法强制谷歌地图在我的用户名中调整大小？

Answer 1

如果您调整地图的div容器的大小，则还必须调整地图对象的大小。如Reference中所述：

  

当div更改大小时，开发人员应在地图上触发此事件：google.maps.event.trigger(map, 'resize')。

其中map是google.maps.Map对象的变量名称。 （我猜你只能在全局命名空间中访问它。）

<强>更新

首先，要访问由Backbone.View.extends构建的属性，您需要访问该类的prototype - 在本例中为window.gg.guessMapView.prototype。接下来，我们需要指定视图将使用的el。因为这最初是由Backbone视图生成的 - 因为它应该是 - 您无法访问它。有关详细信息，请参阅此article。我们想要做的是将现有的html元素附加到它，即#guessMapContainer元素。

window.gg.guessMapView.prototype.$el = $('#guessMapContainer')

指定元素后，您需要重新初始化视图，以便再次渲染地图。可以使用已为视图实现的initialize()方法完成此操作。

window.gg.guessMapView.prototype.initialize()