Skip to main content

Bootstrap 3 and Google Maps

Notes:

  1. This is an update to the older post using Bootstrap 2 with Google Maps.
  2. This post is outdated, and is in the queue for an overhaul. Check out github repo for the latest code.

There are changes in Bootstrap 3 that stops Google maps from displaying correctly in modals, or tabs.  This post described how to update your code from Bootstrap 2.

To use in a tab, change the following:

$("#myModal").modal({ show: false }).on("shown", function(){

To: 

$("#myModal").on("shown.bs.modal", function () {
//or shown.bs.tab for tabs

That's it!

Check out a demo on my github account (there is a code for a single point, and multiple).

Resources: