javascript - 控制定位

Question

我有一个控件，我正在使用 google maps v3 添加到地图中，目前它看起来像这样：

看看右边的箭头是怎么出到一边的？

我目前正在使用以下代码添加它：

// Create a div to hold the control.
var controlDiv = document.createElement('div');
var controlUI = document.createElement('button');
controlUI.id = "out";
controlUI.innerHTML = "<i class='icon-chevron-right'></i>";
controlDiv.appendChild(controlUI);

Maps.map.controls[google.maps.ControlPosition.TOP_LEFT].push(controlDiv);

它有CSS ...

#out {position:relative;top:5px;right:0;float:right;border:1px #aaa solid;border-left:0;padding:2px 4px;-webkit-border-top-right-radius: 2px;-webkit-border-bottom-right-radius: 2px;-moz-border-radius-topright: 2px;-moz-border-radius-bottomright: 2px;border-top-right-radius: 2px;border-bottom-right-radius: 2px;}

但是位置显然有点偏了。如何使默认控件向下移动以适应自定义控件？

Answer 1

为了让我自己更轻松一些，我建议你也这样做，就是将控件移到另一边，它不会伤害任何人。而且我相信它看起来好多了。

为此，只需将其添加到您的地图选项中

mapTypeControl: false,
panControl:true,
panControlOptions: {
    position: google.maps.ControlPosition.RIGHT_TOP
},
zoomControl:true,
zoomControlOptions: {
    position: google.maps.ControlPosition.RIGHT_TOP
},
streetViewControl:true,
streetViewControlOptions: {
    position: google.maps.ControlPosition.RIGHT_TOP
},