百度地图源码实例

效果：
百度地图源码实例

源码：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- <script sre="http://api.map.baidu.com/api?v=2.0&ak=eGVnbkSYvpOBW7YT5TbSRsqwDsc46aQF
    "></script> -->
    <!-- 引用百度地图API文件 -->
    <!-- 浏览器http://api.map.baidu.com/api?v=2.0&ak=hCACzx3Q5u34lbve6AqG0trd0CGYaLy2 -->
    <script src="http://api.map.baidu.com/getscript?v=2.0&ak=hCACzx3Q5u34lbve6AqG0trd0CGYaLy2&services=&t=20180917142401"></script>
    <!-- <script src="http://api.map.baidu.com/getscript?v=2.0&ak=whGsaocG8zEr0ONarMZtLHIKsQbKYbNY&services=&t=20180823194355"></script> -->

    <style>
        body{
            margin: 0;
            padding: 0;
        }

        #allmap {
            height: 600px;
        }
    </style>
</head>

<body>
    <!-- 放置地图的容器 -->
    <div id="allmap"></div>

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

</html>

操作：

1.注册百度账号，并申请ak

2.选择所有人
浏览器 *
服务器 0.0.0.0/0

3.推送到GitHub并发布
网站https://github.com/yanfengting/
网址上面new repository
本地克隆-提交并推送
网址发布 setting-Choose a theme

参考文档：
http://lbsyun.baidu.com/