Will be blank screen with TileOverlay in case the map page is loaded as a main page by lazy loading at Ionic4

[JeongJun-Lee]

I'm submitting a ... (check one with "x")

• question
• any problem or bug report
• feature request

If you choose 'problem or bug report', please select OS: (check one with "x")

• Android
• iOS
• Browser

cordova information: (run $> cordova plugin list)

cordova-plugin-device 2.0.2 "Device"
cordova-plugin-googlemaps 2.6.2 "cordova-plugin-googlemaps"
cordova-plugin-ionic-keyboard 2.1.3 "cordova-plugin-ionic-keyboard"
cordova-plugin-ionic-webview 4.0.1 "cordova-plugin-ionic-webview"
cordova-plugin-splashscreen 5.0.2 "Splashscreen"
cordova-plugin-statusbar 2.4.2 "StatusBar"
cordova-plugin-whitelist 1.3.3 "Whitelist"

If you use @ionic-native/google-maps, please tell the package.json (only @ionic-native/core and @ionic-native/google-maps are fine mostly)
"@ionic-native/core": "^5.0.0",
"@ionic-native/google-maps": "^5.5.0",

Current behavior:

Will be blank screen with TileOverlay in case the map page is loaded as a main page by lazy loading
This issue is similar to #190

Expected behavior:

the map page is loaded as a main page by lazy loading should be seen well, not a blank.

Screen capture or video record:

Related code, data or error log (please format your code or data):
https://github.com/JeongJun-Lee/ionic4-gmap-overlay

The person who share your project files on Github (or other git repository) is in faster lane than other people.
Please share your project files on Github or others(Bitbucket, Gitlabs...etc).
If you don't want to share your project files, please create a demo project, then share it.

Screen captures, and/or native logs(such as Logcat, xcode logs) are appreciate.

Giving much information, you are waiting time is less.
Thank you for your cooperation.

[wf9a5m75]

I checked your repo on my phone. I haven't tested it, but I guess you installed this plug-in with --variable GOOGLE_MAPS_ANDROID_API_KEY.

The specification way has been changed since v2.6.0.
You need to define your API keys in config.xml file, not variable option.

[JeongJun-Lee]

I have already two lines like below

<preference name="GOOGLE_MAPS_ANDROID_API_KEY" value="***" />
<preference name="GOOGLE_MAPS_IOS_API_KEY" value="****" />

at https://github.com/JeongJun-Lee/ionic4-gmap-overlay/blob/master/config.xml

[JeongJun-Lee]

Found reasons:

1. The blank screen was from wrong GOOGLE_MAPS_ANDROID_API_KEY value.
2. Even though the right API_KEY was, the overlay images was not shown. So I changed the tile's URL to full path like "http://localhost/assets/tiles/13/5618/3163.png".

Finally it works well. But I suggest to show error logs at the case 1 or 2 in Browser console, because there was no error log, it was really hard to find the root causes.

Thanks.