ROS与Web交互控制显示_tf2_web_republisher

环境配置

每次机器人建图都需要使用远程软件到机器人上进行建图、定位。真是太烦了ing。所以准备搞一个web界面控制机器，并在web上显示点云地图。先上自己做的index.html连接：

git clone https://gitee.com/NovaWu/ros_web.git
1

ros机器人建图的一些接口，使用system()函数进行roslaunch和rosnode kill一些节点。

git clone https://gitee.com/NovaWu/robot_api.git
1

1.安装rosbridge:

sudo apt-get install ros-melodic-rosbridge-suite
1

2.获取相关JavaScript库:

git clone https://github.com/RobotWebTools/roslibjs.git
git clone https://github.com/RobotWebTools/ros2djs.git
git clone https://github.com/RobotWebTools/ros3djs.git
git clone https://github.com/rctoris/mjpegcanvasjs.git
1
2
3
4

3.3D可视化效果:

需要用到3D可视化效果，那么还需要安装tf2_web_republisher，tf2_web_republisher的作用是计算TF数据并通过rosbridge_server发给ros3djs client(ROSLIB.TFClient 实例)，ROSLIB.TFClient对象订阅来自tf2_web_republisher的TF数据并更新ROS3D.Viewer对象，ROS3D.Viewer对象将URDF model在浏览器里可视化。

sudo apt install ros-melodic-tf2-web-republisher
1

4.模拟视频监控:

git clone https://github.com/RobotWebTools/web_video_server.git
1

由于我使用的是Intel d455深度相机的视频数据流，所以需要新建一个launch文件：

<launch>
  <node pkg="web_video_server" type="web_video_server" name="web_video_server_1" output="screen">
    <param name="port" type="int" value="8080" />
    <param name="address" type="string" value="127.0.0.1" />
    <param name="server_threads" type="int" value="1" />
    <param name="ros_threads" type="string" value="2" />
    <param name="width" type="int" value="640" />
    <param name="height" type="int" value="480" />
    <param name="quality" type="int" value="30" />
  </node>
</launch>
1
2
3
4
5
6
7
8
9
10
11

此处有一个问题是在远端不能显示视频数据，不知道此处的ip要改成什么，是不是只能对应的ip才能看到数据，有了解的大佬可以安利我一下。

5.需安装个http sever，比如安装apache,下面是安装apache2并启动:

sudo apt-get install apache2
1

启动apache2

systemctl restart apache2.service
1

6.将机器人作为服务器

拷贝demo目录(ros_web)到apache下并访问它：

cp -rf ros_web /var/www/html
1

在其他电脑上的浏览器输入

http://192.168.1.172/ros_web/html/index.html
1

7.启动

roscore
roslaunch web_video_server web_video.launch
rosrun tf2_web_republisher tf2_web_republisher
roslaunch rosbridge_server rosbridge_websocket.launch
1
2
3
4

效果图（界面很丑，勿喷~~~~）: