So I'm working on integrating a google map into my current website. Everything works fine, except when I attach infoWindows to my markers, the windows are not sized correctly and then the content scrolls. Before you guys waste time posting, Ive already tried the following:
-creating an inline style with a defined display:block, height, width, overflow, etc -the same for an external style class -removed all my other css declarations in my master CSS file and determined that it IS font-size that messes everything up (I went through every entry by hand). If I comment out font-size:0.85em, everything renders fine on the map (but my font is too big!) -other font measurements pt, px, etc -this tutorial http://econym.org.uk/gmap/css.htm what the heck is wrong with having a global font-size? ===CODE=== var map; var mapCent; var infoWindow; var markersArray = []; //array representing all markers function initialize() { var browserSupportFlag = new Boolean(); var newyork = new google.maps.LatLng(40.69847032728747, -73.9514422416687); mapCent = new google.maps.LatLng(40.2248,-78.8098); var mapOpts = { disableDefaultUI : true, navigationControl : true, navigationControlOptions: { style : google.maps.NavigationControlStyle.ANDROID }, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map"), mapOpts); if(navigator.geolocation) {// W3C Geolocation (Preferred) browserSupportFlag = true; navigator.geolocation.getCurrentPosition(function(position) { mapCent = new google.maps.LatLng(position.coords.latitude,position.coords.longitude); }, function() { handleNoGeolocation(browserSupportFlag); }); } else if (google.gears) { // Google Gears Geolocation browserSupportFlag = true; var geo = google.gears.factory.create('beta.geolocation'); geo.getCurrentPosition(function(position) { mapCent = new google.maps.LatLng(position.latitude,position.longitude); }, function() { handleNoGeoLocation(browserSupportFlag); }); } else {// Browser doesn't support Geolocation browserSupportFlag = false; handleNoGeolocation(browserSupportFlag); } function handleNoGeolocation(errorFlag) { alert("Your browser doesn't support geolocation. We placed you in New York City, but you will have to tell us your current location to get an accurate map."); mapCent = newyork; } updateMapZoom(); map.setCenter(mapCent); searchAirportsNear(mapCent); } function searchAirports() { var geocoder = new google.maps.Geocoder(); var address = document.getElementById("address").value; if (geocoder) { geocoder.geocode( {'address': address}, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { updateMapZoom(); map.panTo(results[0].geometry.location); searchAirportsNear(results[0].geometry.location); } else { alert("We could not find that location in our database"); } }); } } function searchAirportsNear(center) { deleteOverlays(); clearSidebar(); var radius = document.getElementById('radius').value; var searchURL = '/maps/generate-map-xml.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius; downloadURL(searchURL, function(data) { var markers = data.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")),parseFloat(markers[i].getAttribute("lng"))); addMarker(markers[i]); addToSidebar(markers[i].getAttribute('content')); } }); } function addMarker(result) { var marker = new google.maps.Marker({ position : new google.maps.LatLng(parseFloat(result.getAttribute("lat")),parseFloat(result.getAttribute("lng"))), map : map, icon : 'http://static.flyruby.com/images/maps/airplane-marker.png' }); google.maps.event.addListener(marker, "click", function() { if(infoWindow) infoWindow.close(); infoWindow = new google.maps.InfoWindow(); var display = '<div class="infoWindowContent">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam blandit imperdiet metus. Nulla fringilla tincidunt leo, aliquet mattis arcu feugiat sit amet. Suspendisse vel sollicitudin lorem. Sed lobortis congue hendrerit. Pellentesque dignissim, felis egestas ullamcorper egestas, felis libero hendrerit lectus, ut luctus est orci vitae lectus. Nulla ornare lobortis quam, ut rhoncus justo dictum vitae. Mauris commodo est et eros eleifend eu convallis tellus accumsan. Nulla consequat pellentesque urna, a ultrices dolor sollicitudin scelerisque. Etiam iaculis, arcu eget cursus facilisis, diam dui ultrices odio, non porttitor turpis arcu quis augue. Aenean tincidunt egestas tellus in congue.</div>'; infoWindow.setContent(display); infoWindow.open(map,marker); }); markersArray.push(marker); } ===END CODE=== -- You received this message because you are subscribed to the Google Groups "Google Maps JavaScript API v3" group. To post to this group, send email to [email protected]. To unsubscribe from this group, send email to [email protected]. For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.
