给网站插入一个百度地图API

其实调用百度API还是比较容易的，你不用去配置对应api的环境。

1.首先，第一步操作，进入百度地图开发文档

由于我们进行web开发，选择javasc API

使用流程：

 

 2.照着上面的流程走，然后主要的是获取服务密钥，这个很重要的。

3.如果进行快速开发，比如今天我只想做一个demo，可以用上面的示例，下面就是我给我的

 

在html中插入一个标签，id一定要弄对，方便css与js，

css

  #allmap{width: 60%;height:54rem;overflow: hidden;margin:0;font-family:"微软雅黑";border-radius: 4px;}

css由你个人发挥

js

在hear中添加调用百度API的js

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=我的密钥，这里密钥我就不弄出来了"></script>

  <script type="text/javascript">
    // 百度地图API功能
    var map = new BMap.Map("allmap");    // 创建Map实例
    map.centerAndZoom(new BMap.Point(104.62, 28.77), 11);  // 初始化地图,设置中心点坐标和地图级别
    //添加地图类型控件
    map.addControl(new BMap.MapTypeControl({
      mapTypes:[
              BMAP_NORMAL_MAP,
              BMAP_HYBRID_MAP
          ]}));      
    map.setCurrentCity("宜宾");          // 设置地图显示的城市 此项是必须设置的
    map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
  </script>

我的效果图：

如果你想加入不同的组件的话，详见百度地图开发文档。