Google地图：将StyledMapType设置为Terrain

Question

问题：我想使用带有自己样式的google maps v3地形图作为自己的mapType。

我从这段代码开始：

var mapOptions = {
  scrollwheel: false,
  mapTypeId: google.maps.MapTypeId.TERRAIN,
  styles: styles
};

它以我自己的风格显示我的地形。没关系！ 现在，我想把它添加到mapTypeIds

var styledMap = new google.maps.StyledMapType(styles, {
    name: "NSW"
}); 

var mapOptions = {
  scrollwheel: false,
  mapTypeControlOptions: {
    mapTypeIds: [google.maps.MapTypeId.TERRAIN, 'map_style']
  }
};

var map = new google.maps.Map(map_id[0],
    mapOptions);

map.mapTypes.set('map_style', styledMap);
map.setMapTypeId('map_style');

问题是，谷歌地图使用＆＃34; ROADMAP＆＃34;对于＆＃34; StyledMapType＆＃34;并且我不知道如何将其更改为＆＃34; TERRAIN＆＃34;。这甚至可能吗？

更新

如您所见，＆＃34;路线图＆＃34;是默认的。在谷歌地图api的main.js中有一行：

k=c.baseMapTypeId||"roadmap"

那么，什么是baseMapTypeId？我在mapOptions中设置的那个，如：

mapTypeId: google.maps.MapTypeId.TERRAIN

???

五月，这有助于解决我的问题。

Answer 1

你可以这样做：

var styles = [{
    "stylers": [{
        "saturation": -100
    }]
}];

var styledMap = new google.maps.StyledMapType(styles, {
    name: "Name of your style"
});

var myLatlng = new google.maps.LatLng(10, 10);

var map = new google.maps.Map(document.getElementById("map-canvas"), {
    scrollwheel: false,
    center: myLatlng,
    zoom: 10
});

map.mapTypes.set('NSW', styledMap);

var mapTypeControlOptions = {
    mapTypeControlOptions: {
        mapTypeIds: [google.maps.MapTypeId.TERRAIN, 'NSW']
    }
};

map.setOptions(mapTypeControlOptions);

请注意，您StyledMapType的名称是将在地图上显示的名称，以及您使用id方法声明的MapStyle的{​​{1}}是您需要用来引用地图样式的。

希望这有帮助！

JSFiddle demo

修改

如果要在set地图样式上应用自定义样式，可以通过设置当前地图类型的TERRAIN来实现。您可以向地图添加自定义控件以处理切换。

JSFiddle demo

Answer 2

可以为StyledMapType设置其他基础地图。

请注意第二个参数。您实际上已经根据自己的屏幕截图和更新的注释自行解决了此问题。

new google.maps.StyledMapType(styles, { baseMapTypeId: google.maps.MapTypeId.TERRAIN })