木子屋 Dnawo's BLOG

HTML5百度地图基本页模板

👤 dnawo 📅 2022-03-24 👁 2042 👍 0 💬 0 🔄 来源:本站原创
图片

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>百度地图基本页</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <style type="text/css">
        * {margin:0; padding:0;}
        #container {position:absolute; width:100%; height:100%;}
    </style>
    <script src="https://api.map.baidu.com/api?v=3.0&ak=KCGfKcGhNO2vPBIRrPxSLxPPvPXmmGSs"></script>
</head>

<body>
    <div id="container"></div>
    <script type="text/javascript">
        //添加地图
        var map = new BMap.Map("container");
        map.centerAndZoom(new BMap.Point(120.124469,30.26139), 11);
        map.addControl(new BMap.NavigationControl());
        map.addControl(new BMap.ScaleControl());
        map.addControl(new BMap.OverviewMapControl());
        map.addControl(new BMap.MapTypeControl());
        map.addControl(new BMap.GeolocationControl());
        map.enableScrollWheelZoom(true);
    </script>
</body>
</html>

说明:百度地图ak需到开放平台申请并替换成自己的才能正常使用。

相关链接

[1].百度地图开放平台:https://lbsyun.baidu.com/

评论(0)

暂无评论。

验证码
评论需审核通过后显示
← 上一篇 ECMAScript和Javascript的区别与关系 下一篇 → HTML5唤起百度地图APP示例