用js调用百度地图API

最新推荐文章于 2024-08-03 16:53:18 发布

m0_52434369

最新推荐文章于 2024-08-03 16:53:18 发布

阅读量781

点赞数

文章标签： javascript css html css3

本文链接：https://blog.csdn.net/m0_52434369/article/details/118367776

版权

如何用js实现百度地图API的调用，大家可以参考这最基本的几步哟~~
大家可以直接复制代码看效果哟，里面都有详细的注解，虽然很方便，但还是建议大家去看官方文档哦



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />  
    <title>Document</title>
     <!-- 这里注意要将等号后面的换成自己的秘钥哟 -->
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=KYLO624hcCPsw57FbQy8x2yoshzGOzF6"></script>
    
    <style type="text/css">  
        html{height:100%}    
        body{height:100%;margin:0px;padding:0px}    
        #container{height:100%}    
    </style> 
</head>
<body>
    <!-- 用于装地图的容器，样式设置为全屏 -->
    <div id="container"></div> 
</body>
 <script>
//1:创建地图实例
var map = new BMap.Map("container"); 
//2:设置中心坐标 
var point = new BMap.Point(106.60206394754, 29.4287806047);    //这里以天安门为中心为例
//3:初始化和展示级别
map.centerAndZoom(point, 16); 
//4:鼠标滚动控制缩放
map.enableScrollWheelZoom(true)
</script>
</html>

声明：本人大二软工一枚，若文章有错之处还请大家指正，一定不甚感激，大家也可以评论，我们一起交流，一起进步鸭@！