物联网开发-基于UWB开发板实现电子围栏_qt实现绘制电子围栏绘制

更改部分数据结构体的定义，446行新增函数用于上传数据

需下载指定版本QT，否则可能编译出错，请自行查看http://51uwb.cn

0x01快速开始

运行后端

• 环境搭建

使用goland打开go_server文件夹路径，在终端执行以下命令：

go mod tidy

• 修改配置

修改文件根目录中的config.yaml，在其中配置你的数据库信息

• 执行以下命令运行服务

go run main.go
或
go generate

• 如需打包

go build main.go #编译成windows可执行文件，如需在linux执行，自行查阅交叉编译

运行前端：

• 环境搭建

进入到front_client文件目录下，执行以下命令

yarn

• 执行以下命令运行服务

yarn serve

• 如需打包

yarn build

运行成功后代开浏览器并访问http://localhost:8080，即可查看页面

上位机

• 使用qt打开工程文件
• 左下角选择 release 并编译运行，编译完成自动运行
• 将 基站0 通过串口与电脑连接
• 在编译完的上位机软件右上角选择串口并 connect

此时上位机自动将解算出的坐标和距离信息上传至服务器，服务器通过websocket转发到前端页面中实时显示。

数据发送间隔约为50ms

0x02结果展示

• 界面展示
• 数据库结果

• 运行结果

0x03文档

#mermaid-svg-dZdljm4eIrTqnWBy {font-family:“trebuchet ms”,verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-dZdljm4eIrTqnWBy .error-icon{fill:#552222;}#mermaid-svg-dZdljm4eIrTqnWBy .error-text{fill:#552222;stroke:#552222;}#mermaid-svg-dZdljm4eIrTqnWBy .edge-thickness-normal{stroke-width:2px;}#mermaid-svg-dZdljm4eIrTqnWBy .edge-thickness-thick{stroke-width:3.5px;}#mermaid-svg-dZdljm4eIrTqnWBy .edge-pattern-solid{stroke-dasharray:0;}#mermaid-svg-dZdljm4eIrTqnWBy .edge-pattern-dashed{stroke-dasharray:3;}#mermaid-svg-dZdljm4eIrTqnWBy .edge-pattern-dotted{stroke-dasharray:2;}#mermaid-svg-dZdljm4eIrTqnWBy .marker{fill:#333333;stroke:#333333;}#mermaid-svg-dZdljm4eIrTqnWBy .marker.cross{stroke:#333333;}#mermaid-svg-dZdljm4eIrTqnWBy svg{font-family:“trebuchet ms”,verdana,arial,sans-serif;font-size:16px;}#mermaid-svg-dZdljm4eIrTqnWBy .label{font-family:“trebuchet ms”,verdana,arial,sans-serif;color:#333;}#mermaid-svg-dZdljm4eIrTqnWBy .cluster-label text{fill:#333;}#mermaid-svg-dZdljm4eIrTqnWBy .cluster-label span{color:#333;}#mermaid-svg-dZdljm4eIrTqnWBy .label text,#mermaid-svg-dZdljm4eIrTqnWBy span{fill:#333;color:#333;}#mermaid-svg-dZdljm4eIrTqnWBy .node rect,#mermaid-svg-dZdljm4eIrTqnWBy .node circle,#mermaid-svg-dZdljm4eIrTqnWBy .node ellipse,#mermaid-svg-dZdljm4eIrTqnWBy .node polygon,#mermaid-svg-dZdljm4eIrTqnWBy .node path{fill:#ECECFF;stroke:#9370DB;stroke-width:1px;}#mermaid-svg-dZdljm4eIrTqnWBy .node .label{text-align:center;}#mermaid-svg-dZdljm4eIrTqnWBy .node.clickable{cursor:pointer;}#mermaid-svg-dZdljm4eIrTqnWBy .arrowheadPath{fill:#333333;}#mermaid-svg-dZdljm4eIrTqnWBy .edgePath .path{stroke:#333333;stroke-width:2.0px;}#mermaid-svg-dZdljm4eIrTqnWBy .flowchart-link{stroke:#333333;fill:none;}#mermaid-svg-dZdljm4eIrTqnWBy .edgeLabel{background-color:#e8e8e8;text-align:center;}#mermaid-svg-dZdljm4eIrTqnWBy .edgeLabel rect{opacity:0.5;background-color:#e8e8e8;fill:#e8e8e8;}#mermaid-svg-dZdljm4eIrTqnWBy .cluster rect{fill:#ffffde;stroke:#aaaa33;stroke-width:1px;}#mermaid-svg-dZdljm4eIrTqnWBy .cluster text{fill:#333;}#mermaid-svg-dZdljm4eIrTqnWBy .cluster span{color:#333;}#mermaid-svg-dZdljm4eIrTqnWBy div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:“trebuchet ms”,verdana,arial,sans-serif;font-size:12px;background:hsl(80, 100%, 96.2745098039%);border:1px solid #aaaa33;border-radius:2px;pointer-events:none;z-index:100;}#mermaid-svg-dZdljm4eIrTqnWBy :root{–mermaid-font-family:“trebuchet ms”,verdana,arial,sans-serif;}

否

是

UWB开发板

上位机发送数据

服务器接收处理数据

存储到数据库

是否在边界内

微信公众号推送报警

前端界面显示

3.1 服务器端

本文服务器基于Golang的gin框架搭建，前端基于vue2实现，服务器接收定位套件通过上位机上传的数据，并结合websocket推送到前端页面显示。数据存储采用postgresql和influxdb两个数据库实现。系统设计流程图如下所示：

3.1.1 Go 和 Gin

​ 在本文中，我们使用 Go 语言和 Gin 框架来构建服务器应用程序。Go 是一种现代化、高性能的编程语言，对于高并发有着语言级的支持。Gin 则是一个基于 Go 语言的轻量级 Web 框架，提供了简单易用的 API 接口和高性能的处理能力。我们选择 Go 和 Gin 作为服务器端的开发语言和框架，以便快速构建可靠和高效的 Web 应用程序。由于开发套件的坐标上传在ms级，对并发性有一定要求，我们选择GO语言可以满足需求。

3.1.2 前后端交互

​ 服务器端采用RESTful风格提供API接口，与上位机和前端页面进行数据交互和通信。此外为了实现实时数据推送和与前端页面的交互，我们采用了 Websocket 技术。Websocket 是一种在客户端和服务器之间实现双向通信的协议，可以在长时间的连接中实时传输数据。通过使用 Websocket，服务器可以将定位套件上传的数据推送到前端页面，并实现实时更新和交互功能。这种双向通信的特性使得服务器和前端页面能够实现实时数据交互和动态更新的功能。

部分路由信息如下：

路由	请求方法	描述
api/ws	GET	前端发起get请求，服务器将其升级为websocket连接
api/ws	POST	上位机向服务器推送数据
api/init	POST	前端界面绘制场景图时提交保存
api/qrcode	GET	获取服务器生成带参数微信公众号二维码

最后

自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数Java工程师，想要提升技能，往往是自己摸索成长，自己不成体系的自学效果低效漫长且无助。

因此收集整理了一份《2024年嵌入式&物联网开发全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上嵌入式&物联网开发知识点，真正体系化！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录大纲截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新！！

-1715768850117)]

[外链图片转存中…(img-TO7RVWjb-1715768850118)]

[外链图片转存中…(img-23rODNFq-1715768850119)]

[外链图片转存中…(img-bWiu8igN-1715768850119)]

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，基本涵盖了95%以上嵌入式&物联网开发知识点，真正体系化！

如果你觉得这些内容对你有帮助，需要这份全套学习资料的朋友可以戳我获取！！

由于文件比较大，这里只是将部分目录大纲截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频，并且后续会持续更新！！