如何在页面中添加地图

百度地图开放平台

在本节案例中，我会向大家展示如何在页面中添加地图。

前置准备

首先这里我选择百度地图API，首先你需要申请成为百度开发者点这里,接着你需要填写一些项目内容，最后再实名认证。

在通过上面的一顿操作后，这时候就需要申请密钥(ak).

点击创建应用

这时候，打开我的应用界面就会显示你刚才添加的应用。

到这里，前置任务就完成了。

页面布局

这里，我们开始搭建展示地图的页面布局。

博主的项目提前写好了，这次想用地图替换之前这里的一张图片，所以页面布局这块也是早就做了的。

1. 首先设置一个map盒子

    

        这是被替换掉的图片
    

2. 给map设置css样式

#map {
  width: 1226px;
  height: 800px;
  padding: 20px;
}

这里设置了宽高以及内边距。

3. 在html页面的页首添加script引入百度地图api

现在，如果不出意外的话，地图已经渲染在页面上了。