Doesn't render correctly if hidden during loading.
zmoshansky opened this issue · comments
I have an SPA with roughly the following structure:
neon-animated-pages
neon-animatable
web componentpaper-card
google-map
If the google-map page is not selected while loading, it fails to render correctly.
By sheer luck I resized the window discovering that it fixed the issue.
Possible Workarounds
(active
is a property that is changed to true when the page is selected).
<template is="dom-if" if="[[active]]">
<google-map latitude="{{_lat}}" longitude="{{_lng}}" fit-to-markers single-info-window>
...
or
_activeChanged: function(active) {
this.$$('google-map').resize();
}
Related to #33 (comment), googlearchive/core-animated-pages#10, PolymerElements/iron-pages#13, and others.
Both of those workarounds are the recommended approach when the map does not size itself properly at load time.