VinceG / twitter-bootstrap-wizard

This twitter bootstrap plugin builds a wizard out of a formatter tabbable structure. It allows to build a wizard functionality using buttons to go through the different wizard steps and using events allows to hook into each step individually.
MIT License
1.39k stars 676 forks source link

google map is not displayed #181

Open DeadKat opened 8 years ago

DeadKat commented 8 years ago

hi @VinceG ,

I'm running into a problem with a google map in a tab.

THe problem is the map is not displayed by default and when clicking the right menu or navigating with prev/next button it is not well displayed.

I know this is a common problem with maps in hidden div.

To correct this i'm calling the resize event in the 'onTabShow' wizzard event

onTabShow: function(tab, navigation, index) { if( index == 3 ) { google.maps.event.trigger(species_map, 'resize'); } },

This does not work but if i manually call the resize event from my console it works. It looks like the event is fired before the actual content of the tab is displayed.

Does anybody ran into this problem too and have a solution ?

DeadKat commented 8 years ago

Ok i got it working adding setTimeout(function(){ google.maps.event.trigger(species_map, 'resize'); }, 200);

but this doesn't look like a great solution, more like a bad fix. :(