相信各位老哥之前已经看过了百度地图的官方文档，没有的建议去看一下，写本篇文章的目的是为了让各位想要学习使用百度地图API的兄弟们可以更加清楚明白的了解它要如何使用，结合本人之前的一些项目，告诉大家我之前踩过的坑，希望各位大佬多多指导，想要入门的兄弟们可以便捷一点。
一、账号注册
首先呢，如果你想要正常使用百度地图API的话，一定要申请开发账号，注册服务密钥，注册方法不再赘述了，官网上很详细，要注意的是同一个百度账号只能申请一次百度开发者！！！！切记！！！不要问我为什么知道（笑哭）
二、hello world
我们以 JavaScript API GL 为例 ，说一下hello world有什么需要注意的。
首先我们需要引入百度地图API的js文件
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=您的密钥"></script>当中 api?v=1.0 ，这个1.0是指 JavaScript API GL 的版本号，因为现在最新的就是1.0，所以这里不需要改，之后如果它继续更新，这个v= 便可以切换他调用的版本号；ak=这里面填写服务密钥，服务密钥很重要，一定要注册百度开发者，再申请密钥。
接下来，要做的是定义地图盒子，也就是承载地图的外部div，下面是官网给出的例子：
<style type="text/css">
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
</style><body><div id="container"></div>
</body>这里呢要罗嗦一下，id为container的盒子其实就是百度地图的承载，我们调用的地图会呈现再这个盒子里，所以呢为了方便之后地图的开发，我建议大家用下面的方式定义地图容器：
<style>.map_box{width:100%;height:400px;}#container{width:100%;height:100%;}
</style><div class="map_box"><div id="container"></div>
</div>在上面的代码中，我把 container外部又包裹了一层div，其目的是为了之后调试的方便，因为直接在盒子容器container的div中修改css样式让我觉得是有风险的。它是容器，那我们就只把它当作容器对待，至于其他效果的实现，我们就把他交给外层的div，可以理解为我们把整个地图容器当作一个组件，为了保证他的独立性，所以把其他展示效果赋予外层的div。
然后，最重要的要来了！
我们要通过js新建地图对象来导入百度地图，具体如下。
<script type="text/javascript">
var map = new BMapGL.Map("container");
// 创建地图实例 ，container为地图容器的idvar point = new BMapGL.Point(116.404, 39.915);
// 创建点坐标 map.centerAndZoom(point, 15);
// 初始化地图，设置中心点坐标和地图级别 </script>这个地方没有什么特别要注意的，需要知道的有三点：
1.如果要制作的页面中只包含一个地图，那么 var map = new BMapGL.Map("container"); 在整个js文件中只可定义一次！！！切记
2.我们需要知道在百度地图中，所有的位置最后都会通过new BMapGL.Point 新建点对象，再把该点渲染到地图中，之后如果想要在地图上做标记，也要通过该方法。
3.我们之后会发现百度地图有很多内置方法，map. ,为了然js代码更加整洁，易于读懂，我们会写很多函数来对其进行操作，这时候可能会用到map方法，但是map方法只能于var map = new BMapGL.Map("container")同级使用，我们要怎么办呢？？？ 没错，我们要通过参数传递，即把map当作参数传给下一级，这样便可以调用他的内置方法。
好了，这样百度地图API的hello world页面就创建成功了。在本片文章中，目前还是介绍的最基础的部分，之后还会为大家介绍其他进阶内容，比如说，标记点啊，标记点筛选啊，还有一些更牛批 的功能，之后再给大家介绍，好了本篇文章到此为止了，第二篇（二）我会尽快发出来
