高德地图轨迹回放/轨迹播放

前言

本篇文章主要介绍高德地图的轨迹回放或播放的实现过程，是基于vue2实现的功能，同时做一些改动也是能够适配vue3的。其中播放条是用的是element UI中的el-slider组件，包括使用到的图标也是element UI自带的。可以实现轨迹的播放、暂停、停止、播放倍数，以及播放拖拽，涉及到的高德地图的相关权限申请，这里就不再赘述，好了，废话不多说，效果图附上。

效果图 

一、地图初始化

首先，需要在组件dom加载完毕后初始化地图，这里小谭直接用的new AMap.Map方法进行初始化，需要在index.html引入高德的服务。

<script src="https://webapi.amap.com/maps?v=2.0&key=你的key"></script>

其次，在引入高德服务之后，需要在单独引入高德AMapUI 组件库，因为轨迹播放是基于该组件库实现的，引入示例：

<!--引入UI组件库（1.1版本） -->
<script src="//webapi.amap.com/ui/1.1/main.js"></script>

最后，就可以进行初始化地图了，注意需要在组件dom加载完毕才能进行初始化！其中this.map是地图实例，附上代码：

 this.map = new AMap.Map('myMap', {zoom: 10, //级别center:[120.209758, 30.246809], //中心点坐标 默认在杭州});

二、轨迹插件初始化

在地图初始化完成之后，可以引入一些需要的插件，这里就不再过多赘述，我们直接引入AMapUI，我们这里用到的是PathSimplifier模块，故只需要引入该模块即可，附上代码：

//加载PathSimplifier，loadUI的路径参数为模块名中 'ui/' 之后的部分
new AMapUI.load(['ui/misc/PathSimplifier'], PathSimplifier => {if (!PathSimplifier.supportCanvas) {alert('当前环境不支持 Canvas！');return;}if (this.pathList?.length) {//启动页面this.initPage(PathSimplifier);}
});

其中，涉及到的this.pathList是我这边后端返回坐标点信息，this.pathList结构如下：

this.pathList = [[120.79580028, // 经度30.03570354 // 纬度],...];

this.initPage方法如下，需要注意的是，方法内声明的content是轨迹播放时展示的车辆图标，如果不需要可以删掉，PathSimplifier中的配置请参照高德地图轨迹展示的开发文档，还有方法最后调用的this.cruiseInit方法已经放到下一部分了。

initPage(PathSimplifier) {let content = PathSimplifier.Render.Canvas.getImageContent('/img/car1.png',() => {//图片加载成功，重新绘制一次this.pathSimplifierIns.renderLater();},function onerror(e) {this.$message({ type: 'error', message: '图片加载失败！' });});this.pathSimplifierIns = new PathSimplifier({zIndex: 100,map: this.map,getPath: function (pathData, pathIndex) {return pathData.path;},renderOptions: {//轨迹线的样式getPathStyle: (pathItem, zoom) => {return {pathLineStyle: {strokeStyle: "red",lineWidth: 6,dirArrowStyle: true,},};},pathNavigatorStyle: {initRotateDegree: 180,width: 20,height: 35,autoRotate: true,content,},},});this.cruiseInit(); //巡航器初始化
}

三、巡航器初始化

巡航器初始化方法this.cruiseInit代码如下：

cruiseInit() {let pathSimplifierIns = [{ path: this.pathList, color: '#28F' }];this.pathSimplifierIns.setData(pathSimplifierIns);this.pointSum = 0;pathSimplifierIns.forEach((item, index) => {this.pointSum += item.path.length;});this.marksIndex = marksIndex;this.cruiseStop();//如果已经存在巡航器，则停止播放
}

其中this.pointSum是为了记录巡航器的最终点数，方便对应到播放条的最大值。

四、巡航器的播放暂停等功能

巡航器的播放、暂停以及倍数的方法如下：

// 创建一个巡航器
createdCruise(index) {// 判断是否传入indexlet cruiseIndex;if (index != undefined) {cruiseIndex = index;this.cruiseIndex = index;} else {cruiseIndex = this.cruiseIndex;}let cruise = this.pathSimplifierIns.createPathNavigator(cruiseIndex, //关联第index条轨迹{loop: false, //循环播放speed: this.speedList[this.speedValue].speed, //速度});if (this.cruise) {// 清空走过的路线this.cruise.destroy();this.cruise = null;}return cruise;
},
// 开始播放
cruiseStart() {this.isPlay = true;if (this.cruise && !this.cruise.isCursorAtPathEnd() && !this.cruise.isCursorAtPathStart() && !this.isComplete) {// 路段未开始并且没有结束的时候 暂停恢复动画 并且动画没有完成的时候this.cruise.resume();return;}this.isComplete = false;if (this.cruiseIndex == 0) {this.cruiseStop();return;}this.cruise = this.createdCruise();// 判断是否传入初始坐标if (this.startPoint) {this.cruise.start(this.startPoint);this.startPoint = 0;} else {this.cruise.start();}this.cruise.on('move', e => {let idx = this.cruise.cursor.idx;let { address, gpsTime, speed } = this.pathList[idx];let trackAddress = {address,gpsTime,speed,};this.$emit('changeData', 'trackAddress', trackAddress);let [min, max] = this.marksIndex[this.cruiseIndex];this.sliderValue = idx + min;});// 巡航完成事触发this.cruise.on('pause', () => {if (this.cruise && this.cruise.isCursorAtPathEnd()) {this.cruiseStart();}});
},// 暂停播放
cruisePause() {this.cruise.pause();this.isPlay = false;
},
// 停止播放
cruiseStop() {if (this.cruise) {// 清空走过的路线this.cruise.destroy();}// 停止播放this.isPlay = false;this.isComplete = true;this.cruiseIndex = -1;// 为重新播放准备this.cruise = this.createdCruise();this.cruiseIndex = -1;this.sliderValue = 0;
},
// 速度改变
speedChange() {if (this.speedValue == this.speedList.length - 1) {this.speedValue = 0;} else {this.speedValue++;}this.cruise.setSpeed(this.speedList[this.speedValue].speed);
},

到这里巡航器的基础功能已经实现，还有一部分关于播放器调整对应轨迹改变，这里我们要用的监听器，即vue的watch属性：

五、变量声明以及HTML结构

其中使用到的变量有这些：

data() {return {    // 地图实例map: null,cruise: null, //巡航器实例cruiseIndex: -1, // 当前播放轨迹下标pathSimplifierIns: null, //轨迹实例isPlay: false, //是否播放isComplete: true, //是否完成pointSum: 0, //播放器总数sliderValue: 0, //播放器当前数startPoint: 0, //下次播放轨迹从当前值开始marksIndex: {}, //每段路的起止坐标pathList: [],// 轨迹坐标speedValue: 3,// 当前播放速度下标// 速度列表，可自定义配置speedList: [{ value: 0.5, speed: 100 },{ value: 1, speed: 200 },{ value: 2, speed: 400 },{ value: 4, speed: 1600 },{ value: 8, speed: 12800 },{ value: 16, speed: 25600 },],};
},

HTML结构：

<template><div class="workTrack"><div id="myMap"></div><div class="sliderBar" v-show="pathList.length"><span @click="cruiseStart()" v-if="!isPlay"><i class="el-icon-video-play"></i></span><span @click="cruisePause" v-else><i class="el-icon-video-pause"></i></span><span @click="cruiseStop"><i class="el-icon-error"></i></span><el-slider :disabled="isPlay" v-model="sliderValue" :max="pointSum" :show-tooltip="false"></el-slider><b @click="speedChange"><i class="el-icon-d-arrow-right"></i><span>×{{ speedList[speedValue].value }}</span></b></div></div>
</template>

css：

.workTrack {width: 100%;position: relative;height: 100%;#myMap {width: 100%;height: 100%;}.sliderBar {position: absolute;bottom: 30px;user-select: none;width: 100%;padding: 10px 2%;background-color: #00000064;border-radius: 400px;backdrop-filter: blur(5px);z-index: 99;width: 80%;right: 0;left: 0;margin: auto;display: flex;justify-content: center;align-items: center;.el-slider {flex: 1;transform: translateY(1px);margin: 0 15px;}::v-deep .el-slider__runway {pointer-events: none;background-color: #00000021;margin: 0;.el-slider__bar {background-color: #1682e6;}.el-slider__stop {background-color: #1682e6;border-radius: 0;width: 2px;}.el-slider__button-wrapper {pointer-events: auto;}.el-slider__marks-text {white-space: nowrap;color: #fff;font-size: 0;}}> span {flex-shrink: 0;transform: translateY(1px);color: #eee;cursor: pointer;margin: 0 5px;transition: 0.3s;font-size: 20px;&:hover {opacity: 0.5;}}> b {flex-shrink: 0;color: #eee;font-weight: normal;margin: 0 5px;cursor: pointer;border-radius: 3px;border: 1px solid #eee;padding: 0px 10px;transition: 0.3s;user-select: none;> span {vertical-align: middle;font-size: 14px;display: inline-block;transform: translateY(-2px);}i {vertical-align: middle;font-size: 16px;display: inline-block;transform: translateY(-1px);}&:hover {opacity: 0.5;}}}}

六：完整代码

完整代码如下：

<!-- * @description 轨迹回放* @fileName: track.vue * @author: tan * @date: 2024-06-17 10:02:28
!-->
<template><div class="workTrack"><div id="myMap"></div><div class="sliderBar" v-show="pathList.length"><span @click="cruiseStart()" v-if="!isPlay"><i class="el-icon-video-play"></i></span><span @click="cruisePause" v-else><i class="el-icon-video-pause"></i></span><span @click="cruiseStop"><i class="el-icon-error"></i></span><el-slider :disabled="isPlay" v-model="sliderValue" :max="pointSum" :show-tooltip="false"></el-slider><b @click="speedChange"><i class="el-icon-d-arrow-right"></i><span>×{{ speedList[speedValue].value }}</span></b></div></div>
</template><script>
export default {data() {return {// 地图实例map: null,cruise: null, //巡航器实例cruiseIndex: -1, // 当前播放轨迹下标pathSimplifierIns: null, //轨迹实例isPlay: false, //是否播放isComplete: true, //是否完成pointSum: 0, //播放器总数sliderValue: 0, //播放器当前数startPoint: 0, //下次播放轨迹从当前值开始marksIndex: {}, //每段路的起止坐标// 轨迹坐标pathList: [// [经度，纬度] 可再次放置测试数据[120.79573938, 30.03576463],],speedValue: 3, // 当前播放速度下标// 速度列表，可自定义配置speedList: [{ value: 0.5, speed: 100 },{ value: 1, speed: 200 },{ value: 2, speed: 400 },{ value: 4, speed: 1600 },{ value: 8, speed: 12800 },{ value: 16, speed: 25600 },],};},mounted() {this.map = new AMap.Map('myMap', {zoom: 10, //级别center: [120.209758, 30.246809], //中心点坐标 默认在杭州});this.$nextTick(() => {this.loadMap();});},methods: {// 加载地图loadMap() {return new Promise((reslove, reject) => {//加载PathSimplifier，loadUI的路径参数为模块名中 'ui/' 之后的部分new AMapUI.load(['ui/misc/PathSimplifier'], PathSimplifier => {if (!PathSimplifier.supportCanvas) {alert('当前环境不支持 Canvas！');return;}if (this.pathList?.length) {//启动页面this.initPage(PathSimplifier);}});reslove();});},initPage(PathSimplifier) {let content = PathSimplifier.Render.Canvas.getImageContent('/img/car1.png',() => {//图片加载成功，重新绘制一次this.pathSimplifierIns.renderLater();},function onerror(e) {this.$message({ type: 'error', message: '图片加载失败！' });});this.pathSimplifierIns = new PathSimplifier({zIndex: 100,map: this.map,getPath: function (pathData, pathIndex) {return pathData.path;},renderOptions: {//轨迹线的样式getPathStyle: (pathItem, zoom) => {return {pathLineStyle: {strokeStyle: 'red',lineWidth: 6,dirArrowStyle: true,},};},pathNavigatorStyle: {initRotateDegree: 180,width: 20,height: 35,autoRotate: true,content,},},});this.cruiseInit();},// 巡航器初始化cruiseInit() {let pathSimplifierIns = [{ path: this.pathList, color: '#28F' }];this.pathSimplifierIns.setData(pathSimplifierIns);this.pointSum = 0;let marksIndex = {};pathSimplifierIns.forEach((item, index) => {this.pointSum += item.path.length;marksIndex[index] = [0, this.pointSum];});this.marksIndex = marksIndex;this.cruiseStop();},// 创建一个巡航器createdCruise(index) {this.cruiseIndex++;// 判断是否传入indexlet cruiseIndex;if (index != undefined) {cruiseIndex = index;this.cruiseIndex = index;} else {cruiseIndex = this.cruiseIndex;}let cruise = this.pathSimplifierIns.createPathNavigator(cruiseIndex, //关联第index条轨迹{loop: false, //循环播放speed: this.speedList[this.speedValue].speed, //速度});if (this.cruise) {// 清空走过的路线this.cruise.destroy();this.cruise = null;}return cruise;},// 开始播放cruiseStart() {this.isPlay = true;if (this.cruise && !this.cruise.isCursorAtPathEnd() && !this.cruise.isCursorAtPathStart() && !this.isComplete) {// 路段未开始并且没有结束的时候 暂停恢复动画 并且动画没有完成的时候this.cruise.resume();return;}this.isComplete = false;if (this.cruiseIndex == 0) {this.cruiseStop();return;}this.cruise = this.createdCruise();// 判断是否传入初始坐标if (this.startPoint) {this.cruise.start(this.startPoint);this.startPoint = 0;} else {this.cruise.start();}this.cruise.on('move', e => {let idx = this.cruise.cursor.idx;let { address, gpsTime, speed } = this.pathList[idx];let trackAddress = {address,gpsTime,speed,};this.$emit('changeData', 'trackAddress', trackAddress);let [min, max] = this.marksIndex[this.cruiseIndex];this.sliderValue = idx + min;});// 巡航完成事触发this.cruise.on('pause', () => {if (this.cruise && this.cruise.isCursorAtPathEnd()) {this.cruiseStart();}});},// 暂停播放cruisePause() {this.cruise.pause();this.isPlay = false;},// 停止cruiseStop() {if (this.cruise) {// 清空走过的路线this.cruise.destroy();}// 停止播放this.isPlay = false;this.isComplete = true;this.cruiseIndex = -1;// 为重新播放准备this.cruise = this.createdCruise();this.cruiseIndex = -1;this.sliderValue = 0;},speedChange() {if (this.speedValue == this.speedList.length - 1) {this.speedValue = 0;} else {this.speedValue++;}this.cruise.setSpeed(this.speedList[this.speedValue].speed);},},watch: {sliderValue(val) {// 正在播放禁止拖拽播放器if (!this.cruise || this.isPlay) return;this.cruise.moveToPoint(val);this.startPoint = val;this.pathSimplifierIns.render();},},beforeDestroy() {if (this.pathSimplifierIns) this.pathSimplifierIns.clearPathNavigators();if (this.pathSimplifierIns) this.pathSimplifierIns.setData([]);if (this.cruise) this.cruise.destroy();if (this.map) this.map.destroy();},
};
</script><style lang="scss" scoped>
.workTrack {width: 100%;position: relative;height: 100%;#myMap {width: 100%;height: 100%;}.sliderBar {position: absolute;bottom: 30px;user-select: none;width: 100%;padding: 10px 2%;background-color: #00000064;border-radius: 400px;backdrop-filter: blur(5px);z-index: 99;width: 80%;right: 0;left: 0;margin: auto;display: flex;justify-content: center;align-items: center;.el-slider {flex: 1;transform: translateY(1px);margin: 0 15px;}::v-deep .el-slider__runway {pointer-events: none;background-color: #00000021;margin: 0;.el-slider__bar {background-color: #1682e6;}.el-slider__stop {background-color: #1682e6;border-radius: 0;width: 2px;}.el-slider__button-wrapper {pointer-events: auto;}.el-slider__marks-text {white-space: nowrap;color: #fff;font-size: 0;}}> span {flex-shrink: 0;transform: translateY(1px);color: #eee;cursor: pointer;margin: 0 5px;transition: 0.3s;font-size: 20px;&:hover {opacity: 0.5;}}> b {flex-shrink: 0;color: #eee;font-weight: normal;margin: 0 5px;cursor: pointer;border-radius: 3px;border: 1px solid #eee;padding: 0px 10px;transition: 0.3s;user-select: none;> span {vertical-align: middle;font-size: 14px;display: inline-block;transform: translateY(-2px);}i {vertical-align: middle;font-size: 16px;display: inline-block;transform: translateY(-1px);}&:hover {opacity: 0.5;}}}
}
</style>

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

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

相关文章

【windows|004】BIOS 介绍及不同品牌电脑和服务器进入BIOS设置的方法

【windows|004】BIOS 介绍及不同品牌电脑和服务器进入BIOS设置的方法

&#x1f341;博主简介&#xff1a; &#x1f3c5;云计算领域优质创作者 &#x1f3c5;2022年CSDN新星计划python赛道第一名 &#x1f3c5;2022年CSDN原力计划优质作者 ​ &#x1f3c5;阿里云ACE认证高级工程师 ​ &#x1f3c5;阿里云开发者社区专家博主 &#x1f48a;交流社…
阅读更多...
【ARM】如何通过Keil MDK查看芯片的硬件信息

【ARM】如何通过Keil MDK查看芯片的硬件信息

【更多软件使用问题请点击亿道电子官方网站】 1、文档目标&#xff1a; 解决在开发过程中对于开发项目所使用的的芯片的参数查看的问题 2、问题场景&#xff1a; 在项目开发过程中&#xff0c;经常需要对于芯片的时钟、寄存器或者一些硬件参数需要进行确认。大多数情况下是需…
阅读更多...
wps-文档-js宏-批量修改表格格式

wps-文档-js宏-批量修改表格格式

目录 前言开启JS宏我的脚本参考API文档 前言 由于需要修改word的表格的格式&#xff0c;一个一个的修改太慢了&#xff0c;所以需要通过宏的方式来修改&#xff0c;需要注意的是低版本可能没有JS宏… 开启JS宏 切换到工具–>点击开发工具 点击之后功能栏会变化成这样 选…
阅读更多...
Dell戴尔灵越Inspiron 16 Plus 7640/7630笔记本电脑原装Windows11下载，恢复出厂开箱状态预装OEM系统

Dell戴尔灵越Inspiron 16 Plus 7640/7630笔记本电脑原装Windows11下载，恢复出厂开箱状态预装OEM系统

灵越16P-7630系统包: 链接&#xff1a;https://pan.baidu.com/s/1Rve5_PF1VO8kAKnAQwP22g?pwdjyqq 提取码&#xff1a;jyqq 灵越16P-7640系统包: 链接&#xff1a;https://pan.baidu.com/s/1B8LeIEKM8IF1xbpMVjy3qg?pwdy9qj 提取码&#xff1a;y9qj 戴尔原装WIN11系…
阅读更多...
CFD笔记

CFD笔记

CFD 定常流动与非定常流动 定常流动&#xff1a;流体流动过程中各物理量均与时间无关; 非定常流动&#xff1a;流体流动过程中某个或某些物理量与时间有关. 运动黏度 运动粘度定义&#xff1a; v μ ρ v \frac{\mu}{\rho} vρμ​&#xff0c;其中 μ \mu μ​表示粘度…
阅读更多...
Node.js进阶——数据库

Node.js进阶——数据库

文章目录 一、步骤1、安装操作 MySQL数据库的第三方模块(mysql)2、通过 mysql 模块连接到 MySQL 数据库3、测试 二、操作 mysql 数据库1、查询语句2、插入语句3、插入语句快捷方式4、更新数据5、更新语句快捷方式6、删除数据7、标记删除 二、前后端的身份认证1、web开发模式1&a…
阅读更多...
如何用python调用C++处理图片

如何用python调用C++处理图片

一. 背景 用pyhton可直接调用C&#xff0c;减少重写的工作量&#xff1b;部分逻辑运算&#xff0c;C的执行效率高&#xff0c;可进行加速。 下面就一个简单的C滤镜&#xff08;彩色图转灰度图&#xff09;为例&#xff0c;展示python调用C 二. 代码实现 代码结构如下&#x…
阅读更多...
如何解决跨区域文件传输存在的安全管控问题？

如何解决跨区域文件传输存在的安全管控问题？

⼤型企业和集团为扩⼤市场份额、优化资源配置&#xff0c;会在不同地区设⽴多级下属分⽀机构、研发中心、实验室等&#xff0c;存在研发数据横向或纵向流转的需求&#xff0c;研发数据进行跨区域文件传输的场景。跨区域可能是网络区域&#xff0c;也可能是地理区域&#xff0c;…
阅读更多...
2-10 基于matlab的动态时间归整（DTW）算法

2-10 基于matlab的动态时间归整（DTW）算法

基于matlab的动态时间归整&#xff08;DTW&#xff09;算法。16页的试验文档。以一个能识别数字0&#xff5e;9的语音识别系统的实现过程为例&#xff0c;阐述了基于DTW算法的特定人孤立词语音识别的基本原理和关键技术。其中包括对语音端点检测方法、特征参数计算方法和DTW算法…
阅读更多...
elasticsearch的安装和配置

elasticsearch的安装和配置

单节点安装与部署 我们通过docker进行安装 1.docker的安装 如果以及安装了docker就可以跳过这个步骤。 首先更新yum: yum update安装docker: yum install docker查看docker的版本&#xff1a; docker -v此时我们的docker就安装成功了。 2.创建网络 我们还需要部署kiban…
阅读更多...
八大排序————C语言版实现

八大排序————C语言版实现

Hello&#xff0c;各位未来的高级程序员们&#xff0c;大家好&#xff0c;今天我就来为大家讲解一下有关排序的内容&#xff0c;我们常见的排序就是我们接下来要讲的这八个排序&#xff0c;我们平常所说的排序有十大排序&#xff0c;我们这里的八大排序是我们生活中最为常见的八…
阅读更多...
idea的右边栏maven不见了(丢了)解决方案以及idea无法识别maven项目

idea的右边栏maven不见了(丢了)解决方案以及idea无法识别maven项目

前言 众所周知&#xff0c;idea是java开发中不可缺少的利器&#xff0c;但是由于功能过多&#xff0c;导致奇怪的问题也很多 问题汇总 idea的右边栏maven丢了 idea无法识别maven项目 对应的解决办法 idea的右边栏maven丢了 原因可能是被自己手动移除了 或者 项目没被正确…
阅读更多...
CTF入门指南

CTF入门指南

何为CTF &#xff1f; CTF&#xff08;Capture The Flag&#xff09;夺旗比赛&#xff0c;在网络安全领域中指的是网络安全技术人员之间进行技术竞技的一种比赛形式。CTF起源于1996年DEFCON全球黑客大会&#xff0c;以代替之前黑客们通过互相发起真实攻击进行技术比拼的方式。…
阅读更多...
研究Redis源码的一些前期准备

研究Redis源码的一些前期准备

一 背景 Redis数据结构讲完后&#xff0c;觉得还是有点不过瘾&#xff0c;想研究一下Redis的底层实现。找了一些相关资料&#xff0c;准备借鉴和学习其他各位大佬钻研Redis底层的方法和经验&#xff0c;掌握Redis实现的基本原理。 二 源码归类 网上有大佬已经总结了…
阅读更多...
一键简易桌签（带背景）-Word插件-大珩助手

一键简易桌签（带背景）-Word插件-大珩助手

问题整理&#xff1a; 如何Word中设计简易桌签&#xff1f;如何设置带背景图的桌签&#xff1f; Word大珩助手是一款功能丰富的Office Word插件&#xff0c;旨在提高用户在处理文档时的效率。它具有多种实用的功能&#xff0c;能够帮助用户轻松修改、优化和管理Word文件&…
阅读更多...
基于改进贝叶斯学习的旋转机械故障诊断（MATLAB）

基于改进贝叶斯学习的旋转机械故障诊断（MATLAB）

贝叶斯理论的基础是18世纪的英国数学家Bayes提出的贝叶斯公式&#xff0c;Bayes在统计决策函数、统计推断以及和统计的估算等数学领域都做出了重要贡献。19世纪&#xff0c;法国数学家Laplace创作的《概率的分析理论》一文利用了贝叶斯分析&#xff0c;但由于当时贝叶斯理论在实…
阅读更多...
微信小程序使用方法

微信小程序使用方法

一.在网页注册小程序账号&#xff08;在未注册的情况下&#xff09; 1.如果你还没有微信公众平台的账号&#xff0c;请先进入微信公众平台首页&#xff0c;点击 “立即注册” 按钮进行注册。我们选择 “小程序” 即可。 接着填写账号信息&#xff0c;需要注意的是&#xff0c;…
阅读更多...
FreeRTOS源码分析

FreeRTOS源码分析

目录 1、FreeRTOS目录结构 2、核心文件 3、移植时涉及的文件 4、头文件相关 4.1 头文件目录 4.2 头文件 5、内存管理 6、入口函数 7、数据类型和编程规范 7.1 数据类型 7.2 变量名 7.3 函数名 7.4 宏的名 1、FreeRTOS目录结构 使用 STM32CubeMX 创建的 FreeRTOS 工…
阅读更多...
每日练题（py,c,cpp）

每日练题（py,c,cpp）

检验素数 from math import sqrt a int(input("请输入一个数&#xff1a;")) for i in range(2,int(sqrt(a))):if a%i 0:print("该数不是素数")breakelse: print("该数是素数")# # 1既不是素数也不是合数 # #可以用flag做标志位 # b int(…
阅读更多...
Opencv学习项目1——pytesseract

Opencv学习项目1——pytesseract

最近开始学习opencv使用&#xff0c;跟着b站一起做实战项目&#xff0c;跟大家分享一下学习成果&#xff0c;大佬勿喷 项目演示 pytesseract 是一个用于文字识别&#xff08;OCR&#xff0c;光学字符识别&#xff09;的 Python 库&#xff0c;它是 Tesseract OCR 引擎的 Python…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023