百度地图JavaScript API开发

想要在自己的网站中加入地图服务,利用百度地图api简单便捷实用

首先百度地图提供了大量地图信息服务,都比较简单容易上手

对于初学者来说简单粗暴最好

首先我们去百度地图官方主页网址是:http://lbsyun.baidu.com/index.php?title=%E9%A6%96%E9%A1%B5

找到web开发中的JavaScript api

然后立即使用就OK了 ,填写信息提交

我们主要目的是获取ak有了ak百度地图才会让我们调用

应用类型选择浏览器端,referer白名单填*就可以表示所有,你要是有域名,就写你的域名.

http://lbsyun.baidu.com/index.php?title=jspopular/guide/show 这里有教程

有了ak以后就简单了

直接上代码吧

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <style type="text/css">
        body, html{width: 100%;height: 100%;font-family:"微软雅黑";text-align: center}
        #baimap{width: 50%;height: 80%;margin-left: auto;margin-right: auto}
        .title{width: 100%;height: 100px}
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的ak"></script>
    <title>百度地图</title>
</head>
<body>
<div class="title">韩春阳</div>
<div id="baimap"></div>
</body>
</html>
<script type="text/javascript">
    var map = new BMap.Map("baimap"); // 创建Map实例
    map.centerAndZoom(new BMap.Point(126.532011,45.876943), 17); // 初始地点,与级别
    map.addControl(new BMap.MapTypeControl()); //添加地图类型控件
    map.setCurrentCity("北京"); // 设置地图显示的城市 此项是必须设置的
    map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放

初始地点坐标去这里找:http://api.map.baidu.com/lbsapi/getpoint/

级别缩放自己搞

百度地图JavaScript API开发

猜你喜欢