Heim >Web-Frontend >HTML-Tutorial >百度地图API的第一次接触_html/css_WEB-ITnose

百度地图API的第一次接触_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 11:47:591298Durchsuche

因为项目的需求,第一次接触了百度API。

 

第一步:引用百度地图API的脚本

  如果在局域网环境中,要把地图文件和js文件都要下载下来

  

<script type="text/javascript"  src="http://api.map.baidu.com/api?key=*****************&v=1.0&services=false"></script>

 

  这个要去百度开发者中心申请KEY

第二步:建立一个你随便取名的div来放地图

<div style="width: 520px; height: 340px; border: 1px solid gray" id="container"></div>

 

第三步:使用百度地图API来构建地图

//初始化地图,把地图放在第二步的div中var map = new BMap.Map("container");//依据经纬度,确定一个点var point = new BMap.Point(116.404, 39.915); //地图中心就是这个点,并且规定地图的放大级数是15map.centerAndZoom(point, 15);  //界面2s后中心移动到一个新点 window.setTimeout(function(){   map.panTo(new BMap.Point(116.409, 39.918));}, 2000);//加载一些界面上的控件:缩放控件、比例尺控件、全局控件map.addControl(new BMap.NavigationControl());map.addControl(new BMap.ScaleControl());map.addControl(new BMap.OverviewMapControl());//在一个点上加一个标识var marker = new BMap.Marker(point);map.addOverlay(marker); 

第四步:连网,用浏览器打开

 

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn