Map is grey (ios and android)

[SergioZhydecky]

Hi. We are doing nativescript application and using your plugin. But today we found that all maps on ios and android devices becomes gray. We did not do anything with them. After a few hours checking and looking for issue (init of map returns success), playing with api key, and other, I've prepared app demo with issue. Hope it helps you to fix it as soon as it possible. demo repository You just need to change api key. Demo done only for android, but as I described above, issue appears on both ios and android.

Waiting for you answer! Thank you :)

[dereekb]

Where are you providing your API Key at?

I checked the repo you posted and didn't see the usage of "provideAPIKey()" for configuring the iOS key anywhere.

declare var GMSServices: any;

if (isIOS) {
  GMSServices.provideAPIKey(environment.iOSGoogleMapsAPIKey);
} else if (isAndroid) {
  // Configured in AndroidManifest.xml
}

As for the Android side, I just ran into the same thing last night when enabling Android on my project and had forgotten to add the API key properly.

I would double check your Android configuration too and make sure it has the key defined in nativescript_google_maps_api.xml and AndroidManifest.xml, as mentioned in the instructions.

Wouldn't hurt to double check your API keys configuration either, making sure you set the restrictions up properly, if you have, or removing the restrictions and retrying.

One other thing you may want to try is registering the MapView element in main.ts when the app starts up, instead of in the angular file incase it gets stripped out. If onMapReady() is getting called and you see it log something then this might not be the issue.

[SergioZhydecky]

Hi Dere, thank you very much for your replay. The thing is we have working map, then in some moment it stopped working. I have done demo application on android platform and have some issue. Keys do not have any restrictions. I tried to add ios and android restrictions (when map worked) but they did not work proper and broke map, so I removed restriction. Pay attention that key in demo application in file nativescript_google_maps_api.xml is wrong for now, and to test map you have to set another key.

Could you please test map with own working key without restriction? The thing is, it looks for me like google has changed something in api and it broken map (such as I did not do any changes related to map)

[SergioZhydecky]

I have just created new key with no restrictions and can see this in test application:

[SergioZhydecky]

There also was issue in app-routing.module.ts in repository of demo. I have already fixed and pushed.

[dereekb]

I just tried it in iOS on an iPhone 11 simulator with an unrestricted key. The only change I made was the one I mentioned above (setting the API key), and the map loaded fine:

I noticed you didn't add the following to AndroidManifest.xml:

    <!-- Google Maps -->
    <meta-data
    android:name="com.google.android.geo.API_KEY"
    android:value="@string/nativescript_google_maps_api_key" />

You did however commit your API key to the demo repo. I ran the Android version with the above change, with your API key, and it did not work.

I swapped my key in and the map loaded/worked. You'll need to double check your API keys.

Feel free to try this API key out. I'll delete it later, but it should at least help you determine if your API key isn't working: AIzaSyDddApLbq9gvNgyx7bfrJW4yUKNcbIJffw

[SergioZhydecky]

Thank you very much. I will try this kay, and if it works will be checking my key settings tomorrow (It's late at my location)

[SergioZhydecky]

Map really works with your key! Thank you! Did you allow some additional apis when creating ?

[dereekb]

These are the only restrictions on that key right now:

[SergioZhydecky]

I got map to work with my key. There was not allowed ios and android sdk. Seams it stoped working without adding selected APIs restriction, will be checking customer account tomorrow at office. Thank you very much for you time!

[dereekb]

Glad I could help! Don't forget to close the issue