Reply To: Google Maps does not load in a Bootstrap modal

• Nono2style

• December 11, 2017 at 8:27 pm

Hello !

Here is a screenshot of the result:

And the map appears (but it is not centered) if I modify the window of my browser.
When I look at the ACF documentation, he tells me to insert this code. But I do not know where …

Solving the hidden map issue

The Google map API will not work as expected if initialized on a hidden element. When the element is show, the map will not display. This scenario is most likely when using a popup modal.

To solve this problem, simply trigger the ‘resize’ event on the map variable after the map element is visible.

// popup is shown and map is not visible
google.maps.event.trigger(map, 'resize');

Thank you very much for your help !