在同一位置更改Google地图控件的顺序(即RIGHT_TOP)

Question

我需要重新排列Google Map(v3,3.4)API中的默认控件.

一切都到位并且有效,但是当我将mapTypeControl,zoomControl,streetViewControl和panControl添加到同一个ControlPosition(即google.maps.ControlPosition.RIGHT_TOP)时,我无法定义它们的呈现顺序.

mapTypeControl的默认值为TOP_RIGHT,但是将其更改为RIGHT_TOP(上面提到的其他默认值)将它添加到此位置的底部:

这是地图选项的代码(永远不要添加OSM层):

var mapOptions = {
zoom: 12,
center: def_center, // is set before this snippet    
mapTypeControl: true,
mapTypeId: user_maptype, // is set before this snippet
mapTypeControlOptions: {
    position: google.maps.ControlPosition.RIGHT_TOP,
    mapTypeIds: [google.maps.MapTypeId.ROADMAP, google.maps.MapTypeId.SATELLITE, google.maps.MapTypeId.HYBRID, google.maps.MapTypeId.TERRAIN, "openstreetmap"]
},
zoomControl: true,
zoomControlOptions: {
    style: google.maps.ZoomControlStyle.DEFAULT,
    position: google.maps.ControlPosition.RIGHT_TOP
},
streetViewControl: true,
streetViewControlOptions: {
        position: google.maps.ControlPosition.RIGHT_TOP
},
panControl: false,
panControlOptions: {
        position: google.maps.ControlPosition.RIGHT_TOP
},
scaleControl: false,
scaleControlOptions: {
        position: google.maps.ControlPosition.BOTTOM_RIGHT
}
};

我需要mapTypeControl作为要渲染的第一个元素(在streetViewControl之上).知道怎么做吗？

Answer 1

此代码在Google代码编辑器中运行良好@ http://code.google.com/apis/ajax/playground/#control_position_v3

最终解决方案是使用TOP_RIGHT而不是RIGHT_TOP

此外,该index物业可以setAttribute像大多数其他物业一样进行更改.

function initialize() {
   var mapDiv = document.getElementById('map-canvas');
   var map = new google.maps.Map(mapDiv, {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      mapTypeControl: true,
      mapTypeControlOptions: { 
         position: google.maps.ControlPosition.TOP_RIGHT
      }, 
      zoomControl: true, 
      zoomControlOptions: { 
         style: google.maps.ZoomControlStyle.DEFAULT, 
         position: google.maps.ControlPosition.RIGHT_TOP 
      }, 
      streetViewControl: true, 
      streetViewControlOptions: { 
         position: google.maps.ControlPosition.RIGHT_TOP 
      }, 
      panControl: false, 
      panControlOptions: { 
         position: google.maps.ControlPosition.RIGHT_TOP 
      }, 
      scaleControl: false, 
      scaleControlOptions: { 
         position: google.maps.ControlPosition.BOTTOM_RIGHT 
      } 
   });
}