Javascript Google Maps v3：如何根据缩放级别更改地图样式？

我正在使用新的谷歌地图v3样式的地图

我想根据缩放级别更改贴图的样式

我有以下伪代码，如何根据缩放级别更改贴图样式

var myOptions = { 
        zoom:      zoom, 
        center:    latlng, 
        disableDefaultUI: true, 
        navigationControl: true, 
        scrollwheel: false, 
        navigationControlOptions: {style: 
google.maps.NavigationControlStyle.SMALL,position: 
google.maps.ControlPosition.TOP_RIGHT}, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 

var mapStyleZoomedOut = [{      featureType: "landscape", 
                                                    elementType: "all", 
                                                    stylers: [{ visibility: "off" }] 
                                                }]; 
var mapStyleZoomedIn = [{       featureType: "landscape", 
                                                    elementType: "all", 
                                                    stylers: [{ visibility: "off" }] 
                                                  },{ 
                                                    featureType: "poi", 
                                                    elementType: "all", 
                                                    stylers: [{ visibility: "off" }] 
                                                  }]; 
map = new google.maps.Map(document.getElementById("find-map"), 
myOptions); 
var styledMapOptions = {map: map}; 
var styleMapType =  new google.maps.StyledMapType(mapStyle, 
mapStyleZoomedOut); 
map.mapTypes.set('minimial', styleMapType); 
map.setMapTypeId('minimial'); 
google.maps.event.addListener(map, 'zoom_changed', function() { 
        // === IF Zoom Level <= 8 use mapStyleZoomedIn 
        // === If Zoom Level > 8 use mapStyleZoomedOut 
}); 

var myOptions={
缩放：缩放，
中心：拉特林，
disableDefaultUI:true，
导航控制：对，
滚轮：错误，
导航控制选项：{样式：
google.maps.NavigationControlStyle.SMALL，位置：
google.maps.ControlPosition.TOP_RIGHT}，
mapTypeId:google.maps.mapTypeId.ROADMAP
}; 
var mapStyleZoomedOut=[{featureType:“景观”，
元素类型：“全部”，
样式器：[{可见性：“关闭”}]
}]; 
var mapStyleZoomedIn=[{featureType:“景观”，
元素类型：“全部”，
样式器：[{可见性：“关闭”}]
},{ 
特征类型：“poi”，
元素类型：“全部”，
样式器：[{可见性：“关闭”}]
}]; 
map=new google.maps.map（document.getElementById（“find map”），
肌肽）；
var styledmappotions={map:map}；
var styleMapType=new google.maps.StyledMapType（mapStyle，
地图样式（缩小）；
map.mapTypes.set（'minimal'，styleMapType）；
map.setMapTypeId（'minimal'）；
google.maps.event.addListener（映射'zoom_changed'，函数（）{
//==如果缩放级别8使用mapStyleZoomedOut
}); 

提前感谢

使用，我从您的源代码中整理了一个测试示例（带有实际值，以使测试工作正常）

下面是我用来成功测试的代码，需要注意的主要代码是start（）函数

var myOptions = { 
        zoom: 7, 
        center: new google.maps.LatLng(1,1), 
        disableDefaultUI: true, 
        navigationControl: true, 
        scrollwheel: false, 
        navigationControlOptions: {style: 'SMALL',position: 'TOP_RIGHT'}, 
        mapTypeId: 'ROADMAP'
}; 

var mapStyleZoomedOut = [{      featureType: "landscape", 
                                                    elementType: "all", 
                                                    stylers: [{ visibility: "off" }] 
                                                }]; 
var mapStyleZoomedIn = [{       featureType: "landscape", 
                                                    elementType: "all", 
                                                    stylers: [{ visibility: "off" }] 
                                                  },{ 
                                                    featureType: "poi", 
                                                    elementType: "all", 
                                                    stylers: [{ visibility: "off" }] 
                                                  }];
function start()
{
  map = new google.maps.Map(document.getElementById("find-map"), myOptions); 
  var styledMapOptions = {map: map, name: 'minimial'}; 
  var styledMapOptions2 = {map: map, name: 'maximial'}; 

  var sMapType = new google.maps.StyledMapType(mapStyleZoomedOut,styledMapOptions); 
  map.mapTypes.set('minimal', sMapType); 
  map.setMapTypeId('minimal'); 

  var sMapType2 = new google.maps.StyledMapType(mapStyleZoomedIn,styledMapOptions2); 
  map.mapTypes.set('maximial', sMapType2);

  google.maps.event.addListener(map, 'zoom_changed', function()
  { 
    var zoomLevel = map.getZoom();
    //DEBUG alert(zoomLevel+', '+map.getMapTypeId());
    var sMapType;
    // === IF Zoom Level <= 8 use mapStyleZoomedIn 
    if(zoomLevel <=8)
      map.setMapTypeId('maximial');
    // === If Zoom Level > 8 use mapStyleZoomedOut 
    else
      map.setMapTypeId('minimal'); 
  });
}

if (window.addEventListener)
  window.addEventListener("load", start, false);
else if (window.attachEvent)
  window.attachEvent("onload", start);

var myOptions={
缩放：7，
中心：新google.maps.LatLng（1,1），
disableDefaultUI:true，
导航控制：对，
滚轮：错误，
导航控制选项：{style:'SMALL'，position:'TOP_RIGHT'}，
mapTypeId:“路线图”
}; 
var mapStyleZoomedOut=[{featureType:“景观”，
元素类型：“全部”，
样式器：[{可见性：“关闭”}]
}]; 
var mapStyleZoomedIn=[{featureType:“景观”，
元素类型：“全部”，
样式器：[{可见性：“关闭”}]
},{ 
特征类型：“poi”，
元素类型：“全部”，
样式器：[{可见性：“关闭”}]
}];
函数start（）
{
map=new google.maps.map（document.getElementById（“查找地图”），myOptions）；
var styledmappotions={map:map，名称：'minimal'}；
var styledmappotions2={map:map，名称：'maximal'}；
var sMapType=new google.maps.StyledMapType（mapStyleZoomedOut，styledmappotions）；
map.mapTypes.set（'minimal'，sMapType）；
setMapTypeId（'minimal'）；
var sMapType2=新的google.maps.StyledMapType（mapStyleZoomedIn，styledmappotions2）；
map.mapTypes.set（'maximal'，sMapType2）；
google.maps.event.addListener（映射'zoom_changed'，函数（）
{ 
var zoomLevel=map.getZoom（）；
//调试警报（zoomLevel+'，'+map.getMapTypeId（））；
变型；
//==如果缩放级别我受@staticbeast solution的启发，做了一些重构

map.mapTypes.set('maximal', new google.maps.StyledMapType(mapStyleZoomedIn, {map: map, name: 'maximal'}));
map.mapTypes.set('minimal', new google.maps.StyledMapType(mapStyleZoomedOut, {map: map, name: 'minimal'}));
map.setMapTypeId('minimal');

google.maps.event.addListener(map, 'zoom_changed', function() {
  if (map.getMapTypeId() !== 'satellite') {
    map.setMapTypeId(map.getZoom() <= 8 ? 'min' : 'max');
  }
});

map.mapTypes.set（'maximal'，新的google.maps.StyledMapType（mapStyleZoomedIn，{map:map，name:'maximal'}））；
map.mapTypes.set（'minimal'，新的google.maps.StyledMapType（mapStyleZoomedOut，{map:map，name:'minimal'}））；
setMapTypeId（'minimal'）；
google.maps.event.addListener（映射'zoom_changed'，函数（）{
if（map.getMapTypeId（）！=='satellite'）{
map.setMapTypeId（map.getZoom（）一个简单的函数，当用户放大时会转到卫星，当用户缩小时会转到路线图

google.maps.event.addListener(map, 'zoom_changed', function() {
    if (map.getZoom() >= 15) {
        map.setMapTypeId('satellite');
    }
    else {
        map.setMapTypeId('roadmap');
    }
});

最后四行是干什么用的？我在地图中使用了你的答案，但没有它们也行。最后四行只是告诉页面在加载窗口时运行start函数（前两行用于现代浏览器，第二行用于旧IE版本）。如果你以不同的方式触发函数，则不需要它们。