Question

我正在使用google地图添加功能的原型，但我无法添加缩放栏，在下图中你可以看到它缺少的缩放栏

enter image description here

我尝试添加初始化：函数

         var mapOptions = {
                zoom: 4,
                center: new google.maps.LatLng(-33, 151),
                panControl: true,
                zoomControl: true,
                scaleControl: true
              }
var map = new google.maps.Map(document.getElementById('map-canvas'),
                            mapOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);

但是我没有成功（我认为这个代码只能用于javascript），我不知道是否应该在其他地方添加这个缩放控件，任何想法哪里可以解决？< / p>

Answer 1

您必须在代码中添加控件才能获得地图中的缩放栏。您可以通过在options变量中添加以下行来获取要查找的缩放控件。

zoomControl:true

您也可以在地图中添加其他控件。

panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true

并将它们实例化如下：

var map = new google.maps.Map(document.getElementById("map"), options);

以下是完整代码：

<!DOCTYPE html>
<html>
<head>
<script
src="http://maps.googleapis.com/maps/api/js">
</script>

<script>
function initialize()
{
var mapProp = {
center: new google.maps.LatLng(41.5456441,-1.159857),
zoom:7,
panControl:true,
zoomControl:true,
mapTypeControl:true,
scaleControl:true,
streetViewControl:true,
overviewMapControl:true,
rotateControl:true,    
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("googleMap"),mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="googleMap" style="width:450px;height:250px;"></div>
</body>
</html>

希望这会有所帮助!!!

如何将缩放栏添加到Google地图

1 个答案: