js 百度地圖加縮放圖表放在左下角具體代碼 new BMap.NavigationControl()
时间: 2024-03-16 10:42:46 浏览: 9
以下是使用百度地图API实现左下角缩放控件的示例代码:
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>百度地图 - 缩放控件</title>
<script src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>
<style type="text/css">
#map{
height: 500px;
width: 100%;
}
.BMap_nav_control{
bottom: 10px;
left: 10px;
}
</style>
</head>
<body>
<div id="map"></div>
<script type="text/javascript">
// 创建地图实例
var map = new BMap.Map("map");
// 创建点坐标
var point = new BMap.Point(116.404, 39.915);
// 初始化地图,设置中心点坐标和地图级别
map.centerAndZoom(point, 15);
// 添加缩放控件
map.addControl(new BMap.NavigationControl());
</script>
</body>
</html>
```
在上面的示例代码中,我们使用了`BMap.NavigationControl()`来创建一个缩放控件,然后使用`map.addControl()`方法将其添加到地图中。在CSS样式中,我们使用了`.BMap_nav_control`类来设置缩放控件的位置。