怎样在前端项目中进行地图类模块的设计？

前端项目中经常会有地图模块类的效果，那么作为前端应该如何进行地图类模块呢，下面小编结合自己的使用经历与百度地图api开发文档所写的百度地图api使用教程。

第一步申请百度账号和AK

进入百度地图开放平台-控制台-创建应用

应用名称可以随便取一个，只要符合命名规范进行

应用类型根据自己的项目类型进行选择

白名单由于是自己本地测试，所以只填*就可以

应用内容填写好后进行提交

第二步获得创建项目的AK

第三步将JavaScript文件引用到自己的项目中

<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=您的密钥"></script>

这里的密钥是第二步的Ak

第四步创建地图容器

<div id="container"></div>

设置地图容器的宽度与高度，否则看不见地图哦

第五步设置地图中心点以及控件

<script type="text/javascript">

// 百度地图API功能

var map = new BMap.Map("container");//获得地图容器

var point = new BMap.Point(116.328854,39.959881);//设置地图中心点的经纬坐标

map.centerAndZoom(point, 18);//设置地图的缩放比例

//创建标记点

var marker = new BMap.Marker(point);

map.addOverlay(marker); // 将标注添加到地图中

</script>

详细地图控件见百度地图开发平台开发文档

这样一个地图模块就可以在自己的项目中呈现了。