Showing a Google Map in a modal created with Twitter Bootstrap

Question

I\'m trying to insert a Google map into a modal using Twitter Bootstrap. The modal shows up with the shape of the map present, but only part of the map is displayed, the res

Answer 1

The accepted answer does, indeed, work in this case where the contents of the div are local. Unfortunately, I had the same problem showing a map that was included as part of remote data. Getting the handle of the map and calling resize did not correctly center my map. Here is how I fixed the issue in my remote data situation.

Include a script tag as part of your remote data with a function to initialize the map

Call the function in the shown event of the dialog on the main page

This way, the map is already sized in the dialog before you initialize it. Hopefully this will help out any others with a similar situation.