百度地图API的使用——网页中写入百度地图

最新推荐文章于 2022-04-01 20:19:06 发布

Happy编程

最新推荐文章于 2022-04-01 20:19:06 发布

阅读量1.2k

点赞数

分类专栏： java&web编程文章标签：百度地图百度地图api web地图

本文链接：https://blog.csdn.net/wanghaiping1993/article/details/44539173

版权

java&web编程专栏收录该内容

46 篇文章 3 订阅

订阅专栏

我们时常在旅行网站、商城网站等都会有一个定位功能和地图出现！那么我们应该要怎样实现这个功能呢？我们自己去实现一个地图，怎样的解决方式显然是不正确的。往往我们都是通过调用成熟的百度地图API，google地图API来实现这个功能。

要使用百度地图一般来说是要去申请一个百度地图的key，然后我们就可以开始写代码了。

申请地址：http://developer.baidu.com/map/index.php?title=jspopular

1、引入百度地图的js库：

2.在<body>中加入显示的<div>

3.加入显示地图的JavaScript

就这么简单我们就可以将地图显示出来了，下面是所有的源码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>同步加载</title>
<script src="http://api.map.baidu.com/api?v=1.2"></script>
</head>
<body>
<div id="map" style="width:500px;height:320px;"></div>
<script>
var map = new BMap.Map("map");
map.centerAndZoom("宁波", 8);
map.addControl(new BMap.NavigationControl());   
map.addControl(new BMap.ScaleControl());   
map.addControl(new BMap.OverviewMapControl()); 
map.enableScrollWheelZoom();
</script>
</body>
</html>

效果如下：

授人以鱼不如授人以渔。

下面把百度地图api的开放平台地址分享给大家，相信大家访问后必有收获。

http://developer.baidu.com/map/jsdemo.htm#a1_2

Happy编程

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
百度地图API的使用——网页中写入百度地图

我们时常在旅行网站、商城网站等都会有一个定位功能和地图出现！那么我们应该要怎样实现这个功能呢？我们自己去实现一个地图，怎样的解决方式显然是不正确的。往往我们都是通过调用成熟的百度地图API，google地图API来实现这个功能。要使用百度地图一般来说是要去申请一个百度地图的key，然后我们就可以开始写代码了。申请地址：http://developer.baidu.com/ma
复制链接

扫一扫