百度地图调用

最新推荐文章于 2024-05-15 20:04:42 发布

陆V

最新推荐文章于 2024-05-15 20:04:42 发布

阅读量650

点赞数 1

文章标签：百度 html html5

jacks ^.^

本文链接：https://blog.csdn.net/weixin_51368376/article/details/120711995

版权

百度地图调用

百度地图开放平台官网地址：https://lbsyun.baidu.com/

1.打开百度地图开放平台官方地址；
在这里插入图片描述

在这里插入图片描述

2、申请密钥（涉及隐私，请自己进行申请）
在这里插入图片描述

申请成功后将会跳转到如下页面

在这里插入图片描述

3、密钥申请成功后：打开代码编辑器 -->创建一个.html的文件–>将下列代码进行粘贴

	<!DOCTYPE html> 
	<html>
	<head> 
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
	<title>Hello, World</title> 
	<style type="text/css"> 
		html{height:100%} 
		body{height:100%;margin:0px;padding:0px} 
		#container{height:100%} 
	</style> 
	<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=您的密钥">
	</script>
	</head> 
	  
	<body> 
		<div id="container"></div>
		<script type="text/javascript">
			var map = new BMapGL.Map("container");
			// 创建地图实例 
			var point = new BMapGL.Point(116.404, 39.915);
			// 创建点坐标 
			map.centerAndZoom(point, 15);
			// 初始化地图，设置中心点坐标和地图级别 
		</script> 
	</body> 
	</html>

注：对文中‘您的密匙’进行修改（修改的密匙如上图获取）

4、保存代码刷新浏览器页面就可以看到我们调用的地图了。
在这里插入图片描述

陆V

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
百度地图调用

百度地图调用百度地图开放平台官网地址：https://lbsyun.baidu.com/1.打开百度地图开放平台官方地址；2、申请密钥（涉及隐私，请自己进行申请）申请成功后将会跳转到如下页面3、密钥申请成功后：打开代码编辑器 -->创建一个.html的文件–>将下列代码进行粘贴 <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-sca
复制链接

扫一扫