聚合谷歌地图组件没有在android / cordova中加载瓷砖

Question

我创建了一个使用谷歌地图组件的简单聚合物组件。然后，使用cordova命令行工具，我将其包装在Android应用程序中。其中大部分都运行良好，但不幸的是谷歌地图组件渲染不正确，只显示左上角的瓷砖。

我非常感谢任何有关为什么会发生这种情况的见解，以及是否有任何可以用来缓解此问题的变通方法，shivs或polyfill。

注意：我确实在这里看到类似的问题，要求调用map.resize（） - 如果我能够以推荐的Polymer最佳实践方式进行此操作，那就太棒了。

截图：

我的组件代码：                                                  

<polymer-element name="wh-admin">
  <template>
    <style>
      ::host {}
    </style>

    <core-scaffold fit>
      <core-header-panel navigation flex mode="seamed">
        <core-toolbar></core-toolbar>
        <core-menu theme="core-light-theme" id="main_menu" selected="0">
          <core-item icon="dns" label="Table View"></core-item>
          <core-item icon="file-map" label="Map View"></core-item>
        </core-menu>
      </core-header-panel>

      <div tool>Water Hero Administration</div>

      <core-animated-pages selected="{{ $.main_menu.selected }}" fit>
        <section>
          <sortable-table columns='["fruit","alice","bill","casey"]' data='[
                  [ "apple", 4, 10, 2 ],
                  [ "banana", 0, 4, 0 ],
                  [ "grape", 2, 3, 5 ],
                  [ "pear", 4, 2, 8 ],
                  [ "strawberry", 0, 14, 0 ] ]'>
          </sortable-table>
        </section>
        <section>
          <google-map latitude="37.779" longitude="-122.3892" minZoom="9" maxZoom="11" fit id="map"></google-map>
        </section>
      </core-animated-pages>
    </core-scaffold>
  </template>
  <script>
    Polymer({});
  </script>
</polymer-element>