天天看點

二、百度地圖二次開發初始化操作

1.初始化百度地圖

2.編寫js

<script type="text/javascript">

//百度地圖API功能    

var map = new BMap.Map("container");

map.centerAndZoom(new BMap.Point(116.331398, 39.897445), 10);

//初始化操作

map.enableScrollWheelZoom();//啟用滾輪放大縮小,預設禁用。

map.enableDragging();//啟用地圖拖拽,預設啟用。

map.enableDoubleClickZoom();//啟用輕按兩下放大,預設啟用。

map.enableKeyboard();//啟用鍵盤操作,預設禁用。鍵盤的上、下、左、右鍵可連續移動地圖。同時按下其中兩個鍵可使地圖進行對角移動。PgUp、PgDn、Home和End鍵會使地圖平移其1/2的大小。+、-鍵會使地圖放大或縮小一級。

map.enableInertialDragging();// 啟用地圖慣性拖拽,預設禁用。

map.enableContinuousZoom();// 啟用連續縮放效果,預設禁用。

map.enablePinchToZoom();//啟用雙指操作縮放,預設啟用。

map.enableAutoResize();//啟用自動适應容器尺寸變化,預設啟用。

</script>

源碼:

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>百度地圖初始化操作</title>
		<style type="text/css">
			#container {
				width: 50%;
				height: 500px;
			}
		</style>
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
	</head>

	<body>
		<div id="container"></div>
		<script type="text/javascript">
			//百度地圖API功能    
			var map = new BMap.Map("container");
			map.centerAndZoom(new BMap.Point(116.331398, 39.897445), 10);
			//初始化操作
			map.enableScrollWheelZoom();//啟用滾輪放大縮小,預設禁用。
			map.enableDragging();//啟用地圖拖拽,預設啟用。
			map.enableDoubleClickZoom();//啟用輕按兩下放大,預設啟用。
			map.enableKeyboard();//啟用鍵盤操作,預設禁用。鍵盤的上、下、左、右鍵可連續移動地圖。同時按下其中兩個鍵可使地圖進行對角移動。PgUp、PgDn、Home和End鍵會使地圖平移其1/2的大小。+、-鍵會使地圖放大或縮小一級。
			map.enableInertialDragging();//	啟用地圖慣性拖拽,預設禁用。
			map.enableContinuousZoom();//	啟用連續縮放效果,預設禁用。
			map.enablePinchToZoom();//啟用雙指操作縮放,預設啟用。
			map.enableAutoResize();//啟用自動适應容器尺寸變化,預設啟用。
		</script>
	</body>

</html>
           

效果圖:

二、百度地圖二次開發初始化操作

相關解釋:

map.enableScrollWheelZoom();//  啟用滾輪放大縮小,預設禁用。

map.enableDragging();//  啟用地圖拖拽,預設啟用。

map.enableDoubleClickZoom();//  啟用輕按兩下放大,預設啟用。

map.enableKeyboard();//  啟用鍵盤操作,預設禁用。鍵盤的上、下、左、右鍵可連續移動地圖。同時按下其中兩個鍵可使地圖進行對角移動。PgUp、PgDn、Home和End鍵會使地圖平移其1/2的大小。+、-鍵會使地圖放大或縮小一級。

map.enableInertialDragging();//  啟用地圖慣性拖拽,預設禁用。

map.enableContinuousZoom();//  啟用連續縮放效果,預設禁用。

map.enablePinchToZoom();//  啟用雙指操作縮放,預設啟用。

map.enableAutoResize();//  啟用自動适應容器尺寸變化,預設啟用。

繼續閱讀