Google Maps loading strangely -
i'm using google maps api (v3) on website show map centered in position.
this code:
<script type="text/javascript"> $(document).ready(function() { var latlng = new google.maps.latlng(-22.924484, -43.208001); var map = new google.maps.map(document.getelementbyid("map-property2"), { zoom: 13, center: latlng, maptypeid: google.maps.maptypeid.roadmap }); }); </script> at end of <head> have:
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> here's result:
as can see it's there's 2 maps there.. if resize window map fixed!
there's problem: see top left corner of map? location of latlng variable.. should center of map, load top-left corner. :/
ps.: there's no error or warning on firebug js console.
i found solution here: major google maps glitch using api v3
and testing discovered thing: i'm trying load map on hidden div (not map canvas, container has it) shown when click on tab menu.
if map load (using settimeout) when tab active , container visible, map loads ok.
i'm goin mad... really.
if have map in hidden div , decide show div need trigger resize event on map.
google.maps.event.trigger(map, 'resize');
Comments
Post a Comment