使用Google Maps API v3向右移动缩放栏

Question

我希望从左到右移动Google Maps Javascript API中的缩放控件.如果我们离开默认设置,我们有:

如果我这样移动它:

panControl: true,
  panControlOptions: {
  position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true,
zoomControlOptions: {
  style: google.maps.ZoomControlStyle.LARGE,
  position: google.maps.ControlPosition.RIGHT_TOP
}

然后我们得到这个:

我也注意到如果你把它设置在左边(不是默认值),你会得到:

理想情况下,我希望它在右侧,并且与平移控件居中,就像默认设置一样,但另一方面.无论如何这样做？

Answer 1

是的,你可以做到.你必须把两者panControl并zoomControl到一个位置-无论是google.maps.ControlPosition.TOP_RIGHT或google.maps.ControlPosition.RIGHT_TOP.

使用:

panControl: true,
panControlOptions: {
  position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true,
zoomControlOptions: {
  style: google.maps.ZoomControlStyle.LARGE,
  position: google.maps.ControlPosition.TOP_RIGHT
}

要么:

panControl: true,
  panControlOptions: {
  position: google.maps.ControlPosition.RIGHT_TOP
},
zoomControl: true,
zoomControlOptions: {
  style: google.maps.ZoomControlStyle.LARGE,
  position: google.maps.ControlPosition.RIGHT_TOP
}

一个简单的解释是Google地图在每个控件位置都有一个容器.定位和缩放这些容器中的每一个,使得所有所需的控制装置都适合.如果存在一些剩余空间(在这种情况下容器的宽度由宽度指定),则控制器居中panControl.如果将控件放在不同的位置,则将它们放入单独的容器中,这些容器按比例缩放和定位.