Sigh. I have seen some answers for how to solve this issue, but I can’t seem to get them to work for me. My google maps, contained within Bootstrap’s tabs, are not properly centering. Rather than the map being centered around a point on the map, its actually got the point in the top left corner. I’ve recreated the issue here, http://www.bootply.com/hGIQuAWD8B. I’ve tried the suggestions here, https://github.com/twbs/bootstrap/issues/2330 but my implementation hasn’ t been successful. I’m open to suggestions if anyone has any or can offer any advice.
This way would cause the maps to be recreated each time the tab is changed. I think you could optimize this a little further by only initializing each map the first time its tab is selected.