我让GPT4为OriginBot开发了一个监控功能
zhezhongyun 2025-02-03 16:04 36 浏览
我在以前的博客中提到过,我在工作中大量使用ChatGPT(GPT4-32k)来辅助我,方案设计、函数编写、code review、编写测试案例以及Debug等等,虽然它做不到完全正确,但是作为一个辅助和参考工具,还是非常有用的。
这次为OriginBot开发监控功能的时候就想尝试用GPT4来完整地开发这个功能,我以前从来没有让GPT4做过完整的任务,因为它受限于上下文的长度,很难完成大型的任务。这是一次尝试,不过从结果来看,还是很不错的。
我使用的是GPT4-32k这个模型,能力相对于GPT3.5要强大不少,我想这也是效果不错的重要原因。
为了能让大家更容易理解下面的内容,我在这里解释一下文章的结构。
“Message From You”后面的内容是我的Prompt,也就是问题,“Message From ChatGPT”后面的内容是ChatGPT的回答。
我还会以引用的格式在一些地方加上我的说明,这些内容不在我跟ChatGPT的对话中。
所以,你如果想简要了解这边博客的话,只要看引用格式的部分就可以了。
_以下是正文,超长的正文,19555个字_
Message From You:
现在你是一名机器人开发方面的专家,熟悉ros2、SLAM、nav2、运动控制和规划等多种机器人相关的技术,也熟悉stm32等嵌入式开发,并且你还熟悉各种机器学习技能,我会交给你一些任务,请你仔细思考后完成这些任务
Message From ChatGPT:
当然,我很乐意帮助您解决问题。请明确告诉我您需要完成的任务和遇到的问题,我会尽力提供最佳的解决方案或建议。
这段对话中,我给ChatGPT赋予了一个机器人开发专家这样一个角色来激活领域知识,从我的使用经验来看,这么做对于提升GPT回答的有效性有一定的提升。
Message From You:
OriginBot是一个有MIPI摄像头、激光雷达、IMU的两轮机器人, 代码是基于ros2 foxy开发的,现在告诉你,OriginBot的摄像头启用后,会通过一个叫做image_raw的topic发布图像数据,现在我要在同一wifi下的另外一个服务器上,通过VUE3+Django+DRF来实时展现连续的视频,起到一个远程监控的作用,请你仔细思考之后拆解这个任务,详细的描述步骤
Message From ChatGPT:
要完成这项任务,我们可以大致将其拆解为以下几个步骤:
- 从ROS 2节点接收摄像头数据
- 你需要创建一个新的ROS 2节点来订阅image_raw topic。当有图像数据发布时,这个节点就能接收到。
- 这个节点可能需要使用一些ROS和机器视觉库(如cv_bridge和OpenCV),把ROS的Image消息转换成适合网络上传输的格式(比如JPEG或PNG)。
2.建立服务器与ROS节点间的通信
- 当ROS节点成功地获取并处理了图像数据后,下一步是在同一WiFi环境下的另一台服务器上建立监听服务。你可以利用WebSocket实现该功能,因为它支持实时、全双工、点对点的连接。
- 在你的ROS节点中,你需要增加WebSocket客户端代码以便于将处理后的图像数据发送给服务器。
3.设置Django + DRF服务器
- 在服务器上,建立一个Django项目,并且利用Django REST framework(DRF)构建API接口。
- 启动一个websocket server,在django project里面, 使用第三方库例如 channels 创建websocket route 来接收ROS节点发过来的图像数据。
4.存储和串流视频
- 往往连续的帧会被组织成视频序列。所以在你已经取得每个单独帧之后,你需要考虑如何把这些帧组织起来,并通过网页进行播放。
- 可以考虑采用某种串流协议如 MPEG-DASH 或 HLS 等。我不清楚 Django 是否内置了这样的功能,但应该有相应的库可以使用。
5.VUE3前端展示
- 利用Vue.js开发前端页面,通过 WebSocket 订阅摄像头捕获的图像流。
- 将接收到的图像以视频方式展示出来。HTML5 video player 或者其他第三方video.js library都可以用于实现这一需求。
以上就是整体的流程。具体实施过程中可能还会涉及到一些灵活调整和详细设计,例如错误处理、线程管理等。
GPT整个解决方案的框架和步骤,以及每个步骤的简单介绍,它给出的这个方案也许行得通,但是以我对于机器人开发有限的经验来看,并不是很好,所以我在后面对于这个框架进行了一定程度的修改。由此可见,并不能完全依赖ChatGPT的回答,一定要加以自己的判断。
Message From You:
现在请你给出第一步“从ROS 2节点接收摄像头数据”的详细说明、步骤、命令和代码,记住,要同时思考与其他所有步骤之间的关联性
Message From ChatGPT:
接收ROS 2节点摄像头数据的具体步骤如下:
1.环境准备
确保你已经安装了ros2 foxy和其他必要依赖库,例如 cv_bridge 和 OpenCV。
2.创建一个ROS 2 package
如果还没有创建过,你需要先创建一个新的ROS 2的package。假设我们将它命名为camera_listener. 以下是在终端中创建这个包的相关命令:
source /opt/ros/foxy/setup.bash # 配置ros2环境变量
mkdir -p ~/robot_ws/src # 创建工作空间和src目录,如果已存在可忽略此步
cd ~/robot_ws/src
ros2 pkg create --build-type ament_python camera_listener # 创建Python类型的ros2包
3.建立ROS 2节点并订阅topic
在camera_listener包中, 创建一个 python 文件(比如 listener.py),用于实现图象获取的 ROS 节点:
import rclpy
from rclpy.node import Node
from sensor_msgs.msg import Image
from cv_bridge import CvBridge
class CameraListener(Node):
def __init__(self):
super().__init__('camera_listener')
self.bridge = CvBridge()
self.subscription = self.create_subscription(
Image,
'image_raw',
self.listener_callback,
10)
self.subscription
def listener_callback(self, msg):
cv_image = self.bridge.imgmsg_to_cv2(msg, desired_encoding='passthrough')
# 对cv_image进行处理
def main(args=None):
rclpy.init(args=args)
camera_listener = CameraListener()
rclpy.spin(camera_listener)
# Destroy the node explicitly
camera_listener.destroy_node()
rclpy.shutdown()
if __name__ == '__main__':
main()
这段代码首先导入必要的模块,然后定义了一个CameraListener类,该类继承自Node,它订阅了’image_raw’ topic。每当有消息发布到这个topic时,都会触发listener_callback方法。
注意这里的imgmsg_to_cv2函数就是把ROS image message转为 OpenCV 的格式。
相关推荐
- JavaScript做个贪吃蛇小游戏(过关-加速),无需网络直接玩。
-
JavaScript做个贪吃蛇小游戏(过关-则加速)在浏览器打开文件,无需网络直接玩。<!DOCTYPEhtml><htmllang="en"><...
- 大模型部署加速方法简单总结(大模型 ai)
-
以下对大模型部署、压缩、加速的方法做一个简单总结,为后续需要备查。llama.cppGithub:https://github.com/ggerganov/llama.cppLLaMA.cpp项...
- 安徽医大第一医院应用VitaFlow Liberty(R)Flex为患者焕然一“心”
-
近日,在安徽医科大学第一附属医院心血管内科负责人暨北京安贞医院安徽医院业务副院长喻荣辉教授的鼎力支持和卓越带领下,凭借着先进的VitaFlowLiberty(R)Flex经导管主动脉瓣可回收可...
- 300 多行代码搞定微信 8.0 的「炸」「裂」特效!
-
微信8.0更新的一大特色就是支持动画表情,如果发送的消息只有一个内置的表情图标,这个表情会有一段简单的动画,一些特殊的表情还有全屏特效,例如烟花表情有全屏放烟花的特效,炸弹表情有爆炸动画并且消息和...
- 让div填充屏幕剩余高度的方法(div填充20px)
-
技术背景在前端开发中,经常会遇到需要让某个div元素填充屏幕剩余高度的需求,比如创建具有固定头部和底部,中间内容区域自适应填充剩余空间的布局。随着CSS技术的发展,有多种方法可以实现这一需求。实现步骤...
- css之div内容居中(css中div怎么居中)
-
div中的内容居中显示,包括水平和垂直2个方向。<html><head><styletype="text/css">...
- 使用uniapp开发小程序遇到的一些问题及解决方法
-
1、swiper组件自定义知识点swiper组件的指示点默认是圆圈,想要自己设置指示点,需要获得当前索引,然后赋给当前索引不同的样式,然后在做个动画就可以了。*关键点用change方法,然后通过e.d...
- 微信小程序主页面排版(怎样设置小程序的排版)
-
开发小程序的话首先要了解里面的每个文件的作用小程序没有DOM对象,一切基于组件化小程序的四个重要的文件*.js*.wxml--->view结构---->html*.wxss--...
- Vue动态组件的实践与原理探究(vue动态组件component原理)
-
我司有一个工作台搭建产品,允许通过拖拽小部件的方式来搭建一个工作台页面,平台内置了一些常用小部件,另外也允许自行开发小部件上传使用,本文会从实践的角度来介绍其实现原理。ps.本文项目使用VueCLI...
- 【HarmonyOS Next之旅】兼容JS的类Web开发(四) -> tabs
-
目录1->创建Tabs2->设置Tabs方向3->设置样式4->显示页签索引5->场景示例编辑1->创建Tabs在pages/index目录...
- CSS:前端必会的flex布局,我把布局代码全部展示出来了
-
进入我的主页,查看更多CSS的分享!首先呢,先去看文档,了解flex是什么,这里不做赘述。当然,可以看下面的代码示例,辅助你理解。一、row将子元素在水平方向进行布局:1.垂直方向靠顶部,水平方向靠...
- 【HarmonyOS Next之旅】兼容JS的类Web开发(四) -> swiper
-
目录1->创建Swiper组件2->添加属性3->设置样式4->绑定事件5->场景示例编辑1->创建Swiper组件在pages/index...
- CSS:Flex布局,网页排版神器!(css3 flex布局)
-
还在为网页排版抓狂?别担心,CSS的flex布局来了,让你轻松玩转各种页面布局,实现网页设计自由!什么是Flex布局?Flex布局,也称为弹性布局,是CSS中的一种强大布局方式,它能够让你...
- 移动WEB开发之flex布局,附携程网首页案例制作
-
一、flex布局体验传统布局兼容性好布局繁琐局限性,不能再移动端很好的布局1.1flex弹性布局:操作方便,布局极为简单,移动端应用很广泛PC端浏览器支持情况较差IE11或更低版本,不支持或仅部...
- 2024最新升级–前端内功修炼 5大主流布局系统进阶(mk分享)
-
2024最新升级–前端内功修炼5大主流布局系统进阶(mk分享)获课》789it.top/14658/前端布局是网页设计中至关重要的一环,它决定了网页的结构和元素的排列方式。随着前端技术的不断发展,现...
- 一周热门
- 最近发表
-
- JavaScript做个贪吃蛇小游戏(过关-加速),无需网络直接玩。
- 大模型部署加速方法简单总结(大模型 ai)
- 安徽医大第一医院应用VitaFlow Liberty(R)Flex为患者焕然一“心”
- 300 多行代码搞定微信 8.0 的「炸」「裂」特效!
- 让div填充屏幕剩余高度的方法(div填充20px)
- css之div内容居中(css中div怎么居中)
- 使用uniapp开发小程序遇到的一些问题及解决方法
- 微信小程序主页面排版(怎样设置小程序的排版)
- Vue动态组件的实践与原理探究(vue动态组件component原理)
- 【HarmonyOS Next之旅】兼容JS的类Web开发(四) -> tabs
- 标签列表
-
- HTML 教程 (33)
- HTML 简介 (35)
- HTML 实例/测验 (32)
- HTML 测验 (32)
- JavaScript 和 HTML DOM 参考手册 (32)
- HTML 拓展阅读 (30)
- HTML常用标签 (29)
- HTML文本框样式 (31)
- HTML滚动条样式 (34)
- HTML5 浏览器支持 (33)
- HTML5 新元素 (33)
- HTML5 WebSocket (30)
- HTML5 代码规范 (32)
- HTML5 标签 (717)
- HTML5 标签 (已废弃) (75)
- HTML5电子书 (32)
- HTML5开发工具 (34)
- HTML5小游戏源码 (34)
- HTML5模板下载 (30)
- HTTP 状态消息 (33)
- HTTP 方法:GET 对比 POST (33)
- 键盘快捷键 (35)
- 标签 (226)
- HTML button formtarget 属性 (30)
- CSS 水平对齐 (Horizontal Align) (30)