cruise/webviz

Webviz Docker镜像文档

镜像概述和主要用途

Webviz是一个基于Web的应用程序，用于ROS（机器人操作系统）bag文件的回放和可视化。它允许用户拖放本地bag文件进行数据分析，或通过rosbridge_server连接到实时机器人或仿真环境。该Docker镜像包含Webviz的静态构建版本，适用于网络连接不稳定的场景（如现场机器人部署），确保用户可使用最新版本的Webviz功能。此外，Webviz项目还包含多个可独立使用的库，用于构建Web-based可视化工具。

核心功能和特性

• webviz-core：ROS bag文件检查工具，提供直观界面进行数据回放与分析（工具地址）。
• regl-worldview：基于regl的React库，支持2D和3D场景渲染，适用于机器人环境可视化（npm包）。
• @cruise-automation/hooks：可重用React hooks集合，简化Web应用开发（npm包）。
• @cruise-automation/button：支持动画进度（用于破坏性操作）、"脉冲"动画和Bulma类的React按钮组件（npm包）。
• @cruise-automation/tooltip：使用popper.js为DOM元素添加丰富、可定制工具提示的React组件（npm包）。

使用场景和适用范围

• 机器人数据离线分析：拖放本地ROS bag文件，可视化传感器数据、轨迹等关键信息。
• 实时机器人监控：通过rosbridge_server连接运行中的机器人或仿真环境，实时查看数据流。
• 现场机器人部署：在网络条件差的环境中，使用本地静态部署的Webviz进行数据可视化。
• Web可视化工具开发：利用提供的独立库（如regl-worldview）构建自定义Web可视化应用。

使用方法和配置说明

Docker部署

Docker镜像是运行Webviz静态版本的推荐方式，基于master分支自动构建，包含最新功能。

基本运行命令

bash
docker run -p 8080:8080 cruise/webviz

参数说明

• -p 8080:8080：端口映射，将容器内8080端口映射到主机8080端口，通过http://localhost:8080访问应用。

访问方式

启动容器后，在浏览器中访问 http://localhost:8080 即可打开Webviz。应用内提供帮助资源：点击右上角"?"图标查看全局指南，各面板右上角"?"图标查看面板专属说明。

手动构建（可选）

如需自定义构建，执行以下步骤：

bash
# 安装依赖
npm run bootstrap

# 生成静态构建文件（输出至__static_webviz__目录）
npm run build-static-webviz

# 在localhost:8080提供静态服务
npm run serve-static-webviz

高级功能

录制视频

将ROS bag文件和布局记录为视频，需满足：

• 安装依赖：npm run bootstrap
• 安装FFmpeg：apt-get install ffmpeg（Linux）或brew install ffmpeg（macOS）
• 准备本地ROS bag文件和布局JSON文件

录制命令示例：

bash
packages/webviz-core/script/record-local-bag-video.js --bag ~/my-bag.bag --layout ~/my-layout.json --mp3 ~/background-music.mp3 --out ~/output-video.mp4 --speed 1.5

性能测量

评估布局与bag文件组合的性能，用于功能优化：

bash
packages/webviz-core/script/measure-performance.js --help

社区与支持

• Slack社区：通过https://github.com/cruise-automation/webviz/issues/461%E4%B8%AD%E7%9A%84%E6%9C%80%E6%96%B0%E9%93%BE%E6%8E%A5%E5%8A%A0%E5%85%A5%EF%BC%8C%E8%8E%B7%E5%8F%96%E7%94%A8%E6%88%B7%E4%BA%A4%E6%B5%81%E6%94%AF%E6%8C%81%E3%80%82
• Foxglove Studio：Webviz的分支项目，由前Cruise员工开发，提供类似功能，若Webviz无法满足需求可考虑使用。