调⽤百度地图接⼝
1.⾸先注册百度账号，申请成为开发者。
2.创建应⽤，获取服务秘钥（ak）
3.引⽤百度地图API⽂件
<script type="text/javascript" src="api.map.baidu/api?v=3.0&ak=您的密钥"></script>
4.创建地图容器元素
  地图需要⼀个HTML元素作为容器，这样才能展现到页⾯上。这⾥我们创建了⼀个div元素
<div id="container"></div>
5.创建地图实例
  位于BMap命名空间下的Map类表⽰地图，通过new操作符可以创建⼀个地图实例。其参数可以是元素id也可以是元素对象。
百度api接口
var map = new BMap.Map("container");
6.设置中⼼点坐标
  这⾥我们使⽤BMap命名空间下的Point类来创建⼀个坐标点。Point类描述了⼀个地理坐标点，其中116.404表⽰经度，39.915表⽰纬度。（为天安门坐标）
var point = new BMap.Point(116.404, 39.915);
7.地图初始化，同时设置地图展⽰级别
  在创建地图实例后，我们需要对其进⾏初始化，AndZoom()⽅法要求设置中⼼点坐标和地图级别。地图必须经过初始化才可以执⾏其他操作。
⾄此，我们就快速创建了⼀张以天安门为中⼼的地图~
8.添加各种控件
ableScrollWheelZoom(true);    //开启⿏标滚轮缩放
2var opts1 = { offset: new BMap.Size(100, 5) }
3 //var opts2 = { offset: new BMap.Size(260, 100) }
4 map.addControl(new BMap.NavigationControl());
5 map.addControl(new BMap.ScaleControl(opts1));
6 map.addControl(new BMap.GeolocationControl());
7var marker = new BMap.Marker(point); // 创建标注
8 map.addOverlay(marker);    // 将标注添加到地图中
9
10var companyName = {
11  width: 80,    // 信息窗⼝宽度
12  height: 30,    // 信息窗⼝⾼度
13  title: ""// 信息窗⼝标题
14 }
15var infoWindow = new BMap.InfoWindow("内容",companyName);  // 创建信息窗⼝对象
16 map.openInfoWindow(infoWindow, Center());      // 打开信息窗⼝

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。