Hey, I’m having an issue displaying two google maps on the same page. The first map shows up perfectly, but the second map doesn’t fully show up. I’m using all the code snippets found on this site to initialize google maps. I’m attaching two screenshots to help illustrate my problem. Thanks for any help.
The first map working: https://www.dropbox.com/s/vf37fgrrj2k5a7f/Screenshot%202014-06-19%2008.22.18.png
The second map not fully rendering: https://www.dropbox.com/s/5tzc3d9lruja5ar/Screenshot%202014-06-19%2008.22.24.png
Having the same issue. Was a solution found?
Yeah, I was able to fix it. I had to tinker with the js supplied by ACF. Are you loading maps in hidden areas that are using Bootstrap collaspe.js?
Hi,
The maps which aren’t working are being hidden in an accordion. The default (open) state map does work.
Here is a link to the code I’m using for multiple maps: https://gist.github.com/phoenixMag00/ea4907403ae3913f5881
You are going to need to mod lines 158 to 172.
It reloads and recenters maps when certain Bootstrap events are fired. Basically anytime a panel is revealed or the window resizes the maps refire.
Hey I am using bootstrap 3 collapse, I still have the problem, the first map loads but other maps are not loading properly. Can you please help me out where I am wrong ?
Hey guys! I’m using Bootstrap 4 and created a structure of 3 tabs.
I’m using @mrbutlertron code, but only first and last tabs maps are displayed.
No idea on how to solve this, any guess?