Gray box map api -
i have problem google map, have website have introduced map using api , problem map when initialized comes in gray, blamed resizing , can not solve. map hidden , , jquery clicking on field in table shown.
enter code here <!doctype html> <html> <head> <style type="text/css"> #googlemap { width: 100%; height: 470px; margin-top: 6.5%; overflow: visible; max-width: none !important; } </style> </head> <div id="googlemap"></div> <script src="https://maps.googleapis.com/maps/api/js?key=[key]&signed_in=false&"> </script> <script> var mycenter = new google.maps.latlng(39.287649, -0.422548); var mycenterverd = new google.maps.latlng(39.287413, -0.422255); var mycenterroig = new google.maps.latlng(39.288497, -0.423953); var mycentergroc = new google.maps.latlng(39.287766, -0.421604); function initialize() { var mapoptions = { center: new google.maps.latlng(39.287413, -0.422255), zoom: 10, maptypeid: google.maps.maptypeid.roadmap, //disabledefaultui: true }; var map = new google.maps.map(document.getelementbyid("googlemap"),mapoptions); //var marker=new google.maps.marker({position:mycenter,icon:'gotaico.png'}); var markerverd = new google.maps.marker({ position: mycenterverd, icon: '../dashboard/include/mapa/iconosrellenos/gotaicoverd.png' }); var markerroig = new google.maps.marker({ position: mycenterroig, icon: '../dashboard/include/mapa/iconosrellenos/gotaicoroig.png' }); var markergroc = new google.maps.marker({ position: mycentergroc, icon: '../dashboard/include/mapa/iconosrellenos/gotaicogroc.png' }); //marker.setmap(map); markerverd.setmap(map); markerroig.setmap(map); markergroc.setmap(map); } //google.maps.event.adddomlistener(window, 'load', initialize); $(document).ready(function(map) { settimeout('initialize()', 2000); google.maps.event.addlistener(map, "idle", function(){ google.maps.event.trigger(map, 'resize'); this.map.setzoom( this.map.getzoom() - 1 ); this.map.setzoom( this.map.getzoom() + 1 ); }); }); </script> </html>
probably should set backgroundcolor transparent in mapoptions.
var mapoptions = { center: new google.maps.latlng(39.287413, -0.422255), zoom: 10, backgroundcolor: 'transparent', maptypeid: google.maps.maptypeid.roadmap, };
Comments
Post a Comment