CODEWITHSUNDEEP
javascriptgoogle-mapsgoogle-maps-api-3
Lucas Mercer
Lucas Mercer

Reputation: 79

Google Maps API V3 Tiles Not Rendering - Whats the Deal?

I am trying to load a map that has a very zoomed in view, with a height of about 8500px and width of only about 400px. When the map loads, some of the top and bottom tiles do not show. If, after the map loads, I zoom out, and back in, it will display, but there are still issues with rendering things like labels and markers on the top and bottom sections.

Here is the jsFiddle that recreates the problem (scroll down in the results) as well as the js for my map initialize function:

function initialize() {
var myStyles = [
    { featureType: "poi",
        stylers: [
            { visibility: "off" },
                ]
    },
    { featureType: "transit",
        stylers: [
            { visibility: "off"},
                ]
    }
];
var center = {lat: 33.7251470, lng: -118.2879740};
var mapOptions = {
    center: center,
    zoom: 18,
    zoomControl: true,
    panControl: false,
    scaleControl: false,
    scrollwheel: false,
    draggable: false,
    mapTypeControl: true,
    streetViewControl: false,
    styles: myStyles,
    };
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

Upvotes: 2

Views: 1466

Answers (1)

Dr.Molle
Dr.Molle

Reputation: 117364

It seems to be an issue of the experimental API-version, load the release-version instead:

https://maps.googleapis.com/maps/api/js?v=3&key=yourkey&callback=initialize

http://jsfiddle.net/n99hLwf5/

Upvotes: 1

Related Questions