0

I am having problems with the zoom control for google maps. The (+) and (-) image is not showing, only an invisible link.

I think it might be the javascript code. I am attaching a picture and code snippet. Suggestions are very welcome =)

Screen Shot Map:

See Image Link

Code snippet:

    ...
    function initialize()
    {
        "use strict";
        geocoder = new google.maps.Geocoder();

        var listing_lat = jQuery('#property_latitude').val();
        var listing_lon = jQuery('#property_longitude').val();

        if (listing_lat==='') {
            listing_lat=google_map_submit_vars.general_latitude
        }

        if (listing_lon === '') {
            listing_lon = google_map_submit_vars.general_longitude
        }

        console.log(listing_lat + ' / ' + listing_lon);

        var mapOptions = {
            zoom: 17,
            scrollwheel: true,
            disableDefaultUI:false,
            center: new google.maps.LatLng(listing_lat, listing_lon),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(
            document.getElementById('googleMapsubmit'),
            mapOptions
        );
        google.maps.visualRefresh = true;

        var point=new google.maps.LatLng(listing_lat, listing_lon);
        placeSavedMarker(point);

        google.maps.event.addListener(map, 'click', function(event) {
            placeMarker(event.latLng);
        });
    }
    ...
Michael Moussa
  • 4,207
  • 5
  • 35
  • 53
Ignacio
  • 13
  • 8
  • It could be something else. Using this code and setting some values for lat/lng I get map. – Anto Jurković Feb 26 '14 at 21:34
  • 1
    Looks like a css problem to me. – geocodezip Feb 26 '14 at 21:44
  • I found the glitch by looking at "Google Maps API V3 : weird UI display glitches", suggested by geocodezip. Now I need some help on how to make this permanent. I understand the problem is related with CSS and I need to overwrite the following style "max-width: 100%", but only for the google map image. Any suggestions on how to target this with CSS without affecting all the other images. – Ignacio Feb 26 '14 at 22:05
  • Below you can find a screenshot form chrome developers, http://www.flickr.com/photos/118326936@N06/12801986834 Thanks for your support!!! – Ignacio Feb 26 '14 at 22:06
  • I try to add these two lines of code to my Style.css, but is not making any difference. Suggestions a very welcome! =) #map_canvas img { max-width: none; } #gmnoprint img { max-width: none!; } – Ignacio Feb 26 '14 at 22:29
  • I got it to work!!! =) Thanks again to geocodezip and Anto!!! The snippet is: .gmnoprint img { max-width: none!important; } – Ignacio Feb 26 '14 at 22:38

0 Answers0