wordpress advanced custom fields google map api key

Question

I have a problem with loading google map with the Advanced Custom Field plugin. I make everything like in the instruction on the plugin page here https://www.advancedcustomfields.com/resources/google-map.
I add google-map field in ACF, but on the page where it should be it appears for a second, and then disappears with the inscription "Oops! Something went wrong. This page didn't load Google Maps correctly. See the JavaScript console for technical details." (see the screenshot). Console says that I need to set the Google API key. I guess I also need to modify some strings in .js file from the ACF instruction, but I don't know which ones. May be someone could help.
Thank you in advance.
screenshot

Answer 1

ACF updated the Google Map documentation

You first have to get a Maps API key and make sure you activate the following APIs :

• Maps JavaScript API
• Geocoding API
• Places API

Then register the API key in your functions.php

If using ACF free

function my_acf_google_map_api( $api ){
    $api['key'] = 'xxx';
    return $api;
}
add_filter('acf/fields/google_map/api', 'my_acf_google_map_api');

If using ACF pro

function my_acf_init() {
    acf_update_setting('google_api_key', 'xxx');
}

add_action('acf/init', 'my_acf_init');

In my case I had to delete & recreate the field so that it saves correctly.