第一次实现百度地图API

第一步：加载百度地图API，ak为百度开发者平台申请的密钥

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

第二步：定义一个存放地图的div

<div id="baiduMap"></div>

第三步：加载地图

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

所有步骤都是官网的例子，然而并没有显示出地图

经过仔细检查，原来差了一步

设置CSS：

<style type="text/css">
        body, html,#baiduMap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
    </style>

这个很重要，如果不指定大小，div的高度为0，所以不会显示出地图

一切就绪，地图出来了。。。