CODEWITHSUNDEEP
javascriptjquerygoogle-mapsgoogle-maps-api-3maps
Mei
Mei

Reputation: 179

Google maps cant change between types

I have two map types, one is a roadmap and one is a custom one. When I change the typeMapId of the map and when I zoom in and out while its selected, it shows the custom map for a second but than it shows the roadmap above it.

If I put the opacity of the roadmap as 0.1 I can see the custom map. I did a map.overlayMapTypes.push(custom) I will always see the custom map above the roadmap no matter what typeMapId is selected. in the network tab i see that it gets the custom map first and then the roadmap.

// mapOptions

var mapOptions = {
    ...
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        mapTypeControlOptions: {
        mapTypeIds: [ "default_map", "custom" ]
    }
}

// Adding the custom map

var custom_opts = {
    getTileUrl: ...,
    tileSize: new google.maps.Size(256,256),
    maxZoom: 24,
    minZoom: 3
}

var custom = new google.maps.ImageMapType(custom_opts);
custom.projection = new FlatProjection();
map.mapTypes.set("custom", custom);

// Switching between the types

if (self.customShown) {
    map.setMapTypeId("flatMap");
    self.customShown = false;
}
else {
    map.setMapTypeId("custom");
    self.customShown = true;
}

What can I do to make them change and see the current selected type above the other type? Thanks for the help.

Upvotes: 0

Views: 259

Answers (1)

MrUpsidown
MrUpsidown

Reputation: 22490

You can use it this way:

var mapType = "custom";
map.setMapTypeId(google.maps.MapTypeId[mapType]);

Upvotes: 1

Related Questions