百度地圖開發第一步

(一)開發背景

超圖和百度地圖各有優勢,但是對於開發者來說,百度地圖更加方便,因爲,不用做數據

(二)萬事開頭難

不想說廢話了,直接上代碼吧,只說一句:js務必寫在html下方,不然會渲染不到

<!DOCTYPE html>
<html>
<head>
	<base href="<?php  echo base_url();?>"/>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<title>地圖展示</title>
	<script type="text/javascript"  src="http://api.map.baidu.com/api?v=2.0&ak=dAiSmSs6IHrw03DIrn0YTWWBTenyA9Iy"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/library/TextIconOverlay/1.2/src/TextIconOverlay_min.js"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/library/LuShu/1.2/src/LuShu_min.js"></script>
	<link href="public/hui_css/initmap_hui.css" type="text/css" rel="stylesheet">
</head>
<body>
	<div id="allmap"></div>
	<div class="funtionbox">
		<button id="coordinate" οnclick="showDeliveryPoint()"/>顯示物資點</button>
		<button id="coordinate" οnclick="endClickGetMapPoint()"/>點擊獲x取座標</button>
		<button id="coordinate" οnclick="getWayPoint()"/>點擊獲取途經點座標</button>
		<button id="coordinate" οnclick="mapPath()"/>路徑分析</button>
		<button id="coordinate" οnclick="mapMorePointPath()"/>路過點物資配送</button>
		<button id="coordinate" οnclick="runMove()">動畫配送</button>
		
<!-- 		<button id="coordinate" οnclick="add_control()"/>添加廊坊瓦片圖</button>
		<button id="coordinate" οnclick="delete_control()"/>刪除廊坊瓦片圖</button> -->
	</div>
</body>

	<script type="text/javascript">
	function initMap() {
		createMap();												// 百度地圖API功能
	
	}
	function createMap(){
		var map = new BMap.Map("allmap");    						// 創建Map實例
		map.centerAndZoom(new BMap.Point(116.73468840933,39.5295131919511), 13);   // 初始化地圖,設置中心點座標和地圖級別
		map.addControl(new BMap.MapTypeControl());   				// 添加地圖類型控件
		map.setCurrentCity("廊坊");          						// 設置地圖顯示的城市 此項是必須設置的
		map.enableScrollWheelZoom(true);     						// 開啓鼠標滾輪縮放
		window.map = map;
	}
	initMap();
	</script>
</html>

(三)申請祕鑰

必須要有祕鑰,自己去百度地圖開發者平臺上去申請,如果申請不下來可以先用我的,不過我的祕鑰應該不會存留很長時間

(四)官方文檔

官方文檔,官方文檔,官方文檔,重要的事說三遍

發佈了73 篇原創文章 · 獲贊 10 · 訪問量 9萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章