java实现调用百度地图

这里使用的springboot+thymeleaf实现,所以需要有springboot技术使用起来更方便


当然,只使用html加js也可以实现,下面直接开始


首先我们需要去百度地图注册一个AK(百度地图开放平台 | 百度地图API SDK | 地图开发)


 找到左上角的开发文档,选择javaScriptAPI




按照步骤一步步走,注册好了后,点击应用管理——点击创建应用——去申请AK密钥



选择浏览器,随便去个名字,白名单必须填写,我们填*表示所有都可以访问!!(只做测试)



创建好了效果如下



就可以获得我们的AK密钥了


接下来直接放入代码,首先我们先搭建一个springboot项目,添加thymeleaf依赖与配置



 直接上地图代码,需要把获取的AK密钥填写进来,一切就准备就绪了


<!DOCTYPE html>
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><style type="text/css">body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}</style><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你的AK密钥"></script><title>地图展示</title>
</head>
<body>
<div id="allmap"></div>
</body>
</html>
<script type="text/javascript">// 百度地图API功能var map = new BMap.Map("allmap");    // 创建Map实例map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);  // 初始化地图,设置中心点坐标和地图级别//添加地图类型控件map.addControl(new BMap.MapTypeControl({mapTypes:[BMAP_NORMAL_MAP,BMAP_HYBRID_MAP]}));map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
</script>

 直接启动,启动后访问相对应的接口,看到如下效果就表示成功了



希望可以帮到各位小伙伴

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/73830.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

学会用命令行创建uni-app项目并用vscode开放项目

(创作不易&#xff0c;感谢有你&#xff0c;你的支持&#xff0c;就是我前行的最大动力&#xff0c;如果看完对你有帮助&#xff0c;请留下您的足迹&#xff09; 目录 创建 uni-app 项目 命令行创建 uni-app 项目 编译和运行 uni-app 项目&#xff1a; 用 VS Code 开发 uni…

教你如何快速阅读葡萄酒标签

我们经常被问及葡萄酒标签上写了什么&#xff0c;总体而言这些信息可以分为四个关键部分&#xff0c;第一品牌或生产商&#xff1b;第二国家或地区&#xff1b;第三葡萄品种&#xff1b;第四年份。 第一品牌或生产商&#xff0c;在寻找葡萄酒的制造商时&#xff0c;著名的品牌名…

一篇文章教会你什么是高度平衡二叉搜索(AVL)树

高度平衡二叉搜索树 AVL树的概念1.操作2.删除3.搜索4.实现描述 AVL树的实现1.AVL树节点的定义2.AVL树的插入3.AVL树的旋转3.1 新节点插入较高右子树的右侧---右右:左单旋3.2 新节点插入较高左子树的左侧---左左:右单旋3.3 新节点插入较高左子树的右侧---左右&#xff1a;先左单…

尖端AR技术如何在美国革新外科手术实践?

AR智能眼镜已成为一种革新性的工具&#xff0c;在外科领域具有无穷的优势和无限的机遇。Vuzix与众多医疗创新企业建立了长期合作关系&#xff0c;如Pixee Medical、Medacta、Ohana One、Rods & Cones、Proximie等。这些公司一致认为Vuzix智能眼镜可有效提升手术实践&#x…

计算机网络的故事——了解Web及网络基础

了解Web及网络基础 文章目录 了解Web及网络基础一、使用 HTTP 协议访问 Web二、HTTP 的诞生三、网络基础 TCP/IP四、与 HTTP 关系密切的协议 : IP、TCP 和 DNS 一、使用 HTTP 协议访问 Web 根据Web浏览器指定的URL&#xff0c;从对应的服务器中获取文件资源&#xff0c;从而显…

深度学习-4-二维目标检测-YOLOv5理论模型详解

YOLOv5理论模型详解 1.Yolov5四种网络模型 Yolov5官方代码中&#xff0c;给出的目标检测网络中一共有4个版本&#xff0c;分别是Yolov5s、Yolov5m、Yolov5l、Yolov5x四个模型。 YOLOv5系列的四个模型&#xff08;YOLOv5s、YOLOv5m、YOLOv5l、YOLOv5x&#xff09;在参数量和性…

手写Ribbon基本原理

本文已收录于专栏 《中间件合集》 目录 概念说明什么是RibbonRibbon和Nginx负载均衡的区别 工作流程代码实现RibbonSDK发送请求端引入RibbonSDK和Nacos的依赖配置文件中填写负载均衡策略调用代码 接收请求端执行效果发送请求端接收请求端 总结提升 概念说明 什么是Ribbon Ribb…

序列号读取

1.序列号读取 1.1 应用示例目的与思路 获取光盘的外接圆&#xff1b;然后进行极坐标变换&#xff0c;获取字符所在的区域&#xff1b;最后进行字符分割、识别及其在原图上显示。 1.2 应用示例相关算子介绍 (1) mean_image(Image : ImageMean : MaskWidth, MaskHeight : ) …

uniapp 手机 真机测试 ​ 云打包 要是没申请 可以使用云打包 然后采用 测试权限即可​

uniapp 手机 真机测试 打开手机 找到手机的 版本号 点击 知道提示 &#xff08;启动开发者模式&#xff09; 然后 在进行usb的连接打开 运行uniapp 到手机基台 手机确认 即可 四&#xff0c; 云打包 要是没申请 可以使用云打包 然后采用 测试权限即可

每日刷题|回溯法解决全排列问题第二弹之解决字符串、字母大小排列问题

食用指南&#xff1a;本文为作者刷题中认为有必要记录的题目 前置知识&#xff1a;回溯法经典问题之全排列 ♈️今日夜电波&#xff1a;带我去找夜生活—告五人 0:49 ━━━━━━️&#x1f49f;──────── 4:59 …

2023国赛数学建模C题思路代码 - 蔬菜类商品的自动定价与补货决策

# 1 赛题 在生鲜商超中&#xff0c;一般蔬菜类商品的保鲜期都比较短&#xff0c;且品相随销售时间的增加而变差&#xff0c; 大部分品种如当日未售出&#xff0c;隔日就无法再售。因此&#xff0c; 商超通常会根据各商品的历史销售和需 求情况每天进行补货。 由于商超销售的蔬菜…

QUIC协议科普导入(一)

一&#xff1a;QUIC协议导入 QUIC是一个通用的传输层网络协议&#xff0c;最初由Google的Jim Roskind设计&#xff0c;2012年实现并部署&#xff0c;2013年随着实验范围的扩大而公开发布&#xff0c;并向IETF描述。虽然长期处于互联网草案阶段&#xff0c;但在从Chrome浏览器到…

vue3中通过ref获取子组件实例,取值为undefined

也就是Vue3如何通过 ref 获取子组件实例(子组件中的DOM结构、数据、及方法)&#xff0c;今天写index.vue(父组件&#xff09;时想获取子组件的数据和方法&#xff0c;通过给子组件绑定ref&#xff0c;打印子组件的数据为undefined&#xff1b;百度搜索常用方法为&#xff1a; …

【C++】继承基础知识一遍过

目录 一&#xff0c;概念 二&#xff0c;继承定义 1. 继承格式 2. 访问限定符与继承方式的关系 3. 继承父类成员访问方式的变化 小结&#xff1a; 三. 父类与子类对象赋值转化 四&#xff0c;继承作用域 1.特点 2. 测试题 五&#xff0c;派生类不一样的默认成员函…

基于深度学习的三维重建从入门实战教程 原理讲解 源码解析 实操教程课件下载

传统的重建方法是使用光度一致性等来计算稠密的三维信息。虽然这些方法在理想的Lambertian场景下,精度已经很高。 但传统的局限性,例如弱纹理,高反光和重复纹理等,使得重建困难或重建的结果不完整。 基于学习的方法可以引入比如镜面先验和反射先验等全局语义信息,使匹配…

Ribbon负载均衡+Nacos服务搭建

Ribbon负载均衡 流程 首先通过RibbonLoadBalanceerClient获取服务名&#xff0c;并传给DynamicServerListLoadBalancer——>通过EureKa-server获取服务名对应服务列表(也就是被注册到EureKa中的服务&#xff0c;可能包括不同端口的)&#xff0c;然后我们会根据IRule中的服务…

【python自动化】playwright长截图切换标签页JS注入实战

前言 当前教程使用的playwright版本为1.37.0,selenium版本为3.141.0 官方文档&#xff1a;https://playwright.dev/python/docs/screenshots 本教程目录如下 文章目录 前言playwright各类截图源码阅读ElementHandle类下的截图Page类下的截图Locator类下的截图 Playwright快速…

官方项目《内容示例》中Common UI部分笔记:Common UI 分场景使用教程

文章目录 前言0. 通用设置0.1 开启插件0.2 设置Viewport 1. 分场景教程1. 1 在仅使用鼠标控制的场景下Common Activatable StackCommon Activatable Widget 1.2 当焦点落到一个按钮时显示默认确认&#xff08;Click/Accept&#xff09;按键图标Common Input Action DataBaseInp…

【Mysql】数据库第二讲(数据库中数据类型的介绍)

数据类型 1.数据类型分类2.数值类型介绍2.1tinyint类型2.2bit类型介绍2.3小数类型介绍2.3.1 float2.3.2decimal 3.字符串类型介绍3.1char3.2varchar面试&#xff1a;char和varchar的区别 4.日期和时间类型5.enum和set 1.数据类型分类 2.数值类型介绍 2.1tinyint类型 数值越界测…

项目(智慧教室)第三部分,人机交互在stm32上的实现

一。使用软件 1.stm32cubemx中针对汉字提供的软件 2.对数据进行处理 2.上面点击ok--》这里选择确定 3.这里选择保存即可由字符库&#xff0c;但是需要占用内存太大&#xff0c;需35M&#xff0c;但是stm32只有几百k&#xff0c;所以需要自己删减。 生成中文字符&#xff08;用…