Using Google Maps for ExpressionEngine with an accordion

gistfile1.html

<!-- This goes in the document HEAD and will add an additional click event to the objects with a class of 'trigger' -->
<script type="text/javascript">

	/* By using the $(document).ready() function, we can ensure this JavaScript gets loaded after all the global map variables are set. */
	
	$(document).ready(function() {
		
		$('.trigger').click(function() {
			
			var $t = $(this);
			var id = $t.data('id');
			var map = window[id+'_canvas'];			
			var center = window[id+'_center'];
			
			/* Allows the animation to start before resizing, the 500(ms) can be adjusted for optimal performance */
			setTimeout(function() {
				google.maps.event.trigger(map, 'resize');
				map.setCenter(center);
			}, 500);
			
			return true;
		});
			
	});

</script>

<!-- Add a data attribute with the corresponding map id for each trigger, this is just one example…-->

<div class="tigger blue open" data-id="map13">
	<h3>
		Toronto
		<a href="#">Open</a>
	</h3>
</div>