百度地图开发第一步

(一)开发背景

超图和百度地图各有优势,但是对于开发者来说,百度地图更加方便,因为,不用做数据

(二)万事开头难

不想说废话了,直接上代码吧,只说一句: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万+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章