Google App Maker中的嵌入式地图无法在Chrome浏览器中呈现

Question

在Google App Maker中，我有一个带有以下标记的HTML小部件：

<div id='map'></div>

我在div中创建了这样的地图：

map = new google.maps.Map(document.getElementById('map'), 
{
  zoom: 11,
  center: {lat: 41.879, lng: -87.624}
});

这在Firefox和IE中运行良好，但在Chrome中，地图不会出现。没有错误，只是一个空的小部件。顺便说一句，我可以在Chrome中显示实际的Map小部件，但我需要它在HTML小部件中。

有人碰到这个吗？

感谢您的任何提示或指示。

斯科特

Answer 1

我能够使用HTML小部件的标记使其在Chrome中运行：

<div id='map' style='width: 100%; height: 100%'></div>

备注：

1. 我为HTML小部件启用了'allowUnsafeHTML'选项。
2. 初始化地图API（google.maps.Map）我刚刚在网页上删除了App Maker Map小部件。
3. 我在页面上按钮的onClick处理程序中调用了原始代码段。

// onClick handler of some button on a page
var map = new google.maps.Map(document.getElementById('map'), 
          {
            zoom: 11,
            center: {lat: 41.879, lng: -87.624}
          });

Answer 2

事实证明，当HTML小部件是固定大小时，这可以正常工作。当窗口小部件设置为“填充父级”时，它不会呈现（但仅在Chrome中）。

所以这是AppMaker或Chrome中的一个错误，可能是前者。