> ## Documentation Index
> Fetch the complete documentation index at: https://avala.ai/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# 可视化

> GPU 加速的多传感器数据可视化

Avala 包含一个专用的可视化工作区，可直接在浏览器中探索多传感器录制。回放 MCAP/ROS 数据，在可配置的面板布局中同步摄像头、LiDAR、雷达和 IMU 流——然后无需切换工具即可标注相同的数据。

查看器基于 WebGPU 运行（支持 WebGL 回退），使用 GPU 计算着色器进行点云渲染、视锥体裁剪和细节层次选择。无需插件、无需桌面应用、无需数据下载。

## 功能

* **多传感器 MCAP/ROS 回放，支持 8 种面板类型** — 图像、3D / 点云、图表、原始消息、日志、地图、仪表盘和状态转换。查看器从录制中自动检测 topic 并将每个分配到适当的面板类型。

* **GPU 加速 3D 点云渲染，支持 6 种可视化模式** — 中性、强度、彩虹、标签、全景和图像投影。切换模式以检查原始强度值、语义标签、全景实例分割或 LiDAR 到摄像头颜色投影。

* **Gaussian Splat 场景查看器，支持 WebGPU 渲染** — 将 3D Gaussian Splat 重建加载到专用查看器中，支持场景层次面板、属性检查器、工具栏、模式切换、撤销/重做和实时统计。基于 GPU 的基数排序和渲染包缓存在大型场景上保持流畅的帧率。

* **多摄像头同步回放，支持 LiDAR 到摄像头投影** — 同步查看多个摄像头流。点云数据使用校准变换投影到摄像头图像上，支持针孔（fx/fy/cx/cy + 畸变 k1-k4/p1-p2）和双球面（xi/alpha）摄像头模型。

* **可配置的多窗口布局，支持拖放面板** — 默认布局在水平根中排列 topic 侧边栏（左）、动态内容面板（中）和文件信息面板（右）。调整大小、重新排列、添加或删除面板以构建您需要的视图。

* **基于时间轴的导航，支持逐帧步进和时间戳搜索** — 在录制中滚动，逐帧步进，调整播放速度，跳转到特定时间戳。所有面板保持同步。

* **自动 topic 检测和智能面板类型分配** — 打开 MCAP 文件时，查看器读取 topic 模式和消息类型，然后为每个创建正确的面板：摄像头 topic 的图像面板、点云的 3D 面板、GPS 的地图面板等。

* **针孔和双球面（鱼眼）摄像头模型支持** — 针孔投影（fx/fy/cx/cy）和双球面投影（xi/alpha），用于 LiDAR 到摄像头叠加。畸变参数已存储；针孔摄像头的径向/切向畸变校正计划在未来更新中提供。

## 支持的消息类型

查看器处理以下 ROS 和 Foxglove 消息类型：

| 类别          | 消息                                                                                               |
| ----------- | ------------------------------------------------------------------------------------------------ |
| **摄像头**     | `sensor_msgs/Image`、`sensor_msgs/CompressedImage`、`foxglove.CompressedImage`、`foxglove.RawImage` |
| **LiDAR**   | `sensor_msgs/PointCloud2`、`foxglove.PointCloud`                                                  |
| **雷达 / 激光** | `sensor_msgs/LaserScan`、`radar_msgs/RadarScan`（通过 topic 名称关键字路由）                                 |
| **变换**      | `tf2_msgs/TFMessage`、`foxglove.FrameTransform`                                                   |
| **位置**      | `sensor_msgs/NavSatFix`                                                                          |
| **IMU**     | `sensor_msgs/Imu`                                                                                |

<Info>
  Avala 原生读取 MCAP 文件。ROS 1 bag 和 ROS 2 bag 应在上传前转换为 MCAP 格式。详情请参阅 [MCAP 和 ROS 集成指南](/docs/integrations/mcap-ros)。
</Info>

## 如果您需要...

| 如果您需要...       | Avala 提供...                                       |
| -------------- | ------------------------------------------------- |
| 回放 MCAP 录制     | 支持 8 种面板类型和同步时间轴的多传感器查看器                          |
| 可视化点云          | 6 种渲染模式（中性、强度、彩虹、标签、全景、图像投影），WebGPU 加速            |
| 查看 3D 场景重建     | Gaussian Splat 查看器，支持场景层次、属性检查器和 GPU 渲染           |
| 检查原始传感器数据      | 录制中每个 topic 的原始消息、图表、日志、仪表盘和状态转换面板                |
| 将 LiDAR 投影到摄像头 | 使用针孔和双球面摄像头标定的自动投影                                |
| 然后标注相同数据       | 完整的标注工具包（边界框、多边形、3D 长方体、分割、折线、关键点、分类），无需切换工具或重新上传 |

## Avala 对比

<div className="comparison-table">
  | 能力                      |                        Avala                       |                      Foxglove                      |                        Rerun                       |
  | ----------------------- | :------------------------------------------------: | :------------------------------------------------: | :------------------------------------------------: |
  | 浏览器端 MCAP 回放            | <span className="yes"><Icon icon="check" /></span> | <span className="yes"><Icon icon="check" /></span> | <span className="yes"><Icon icon="check" /></span> |
  | GPU 加速点云                |         <span className="yes">WebGPU</span>        |       <span className="partial">WebGL</span>       |         <span className="yes">WebGPU</span>        |
  | Gaussian Splat 查看器      | <span className="yes"><Icon icon="check" /></span> |  <span className="no"><Icon icon="xmark" /></span> |  <span className="no"><Icon icon="xmark" /></span> |
  | 多摄像头同步 + 投影             | <span className="yes"><Icon icon="check" /></span> | <span className="yes"><Icon icon="check" /></span> | <span className="yes"><Icon icon="check" /></span> |
  | 在相同数据上标注                |          <span className="yes">全套工具</span>         |  <span className="no"><Icon icon="xmark" /></span> |  <span className="no"><Icon icon="xmark" /></span> |
  | 质量控制工作流                 | <span className="yes"><Icon icon="check" /></span> |  <span className="no"><Icon icon="xmark" /></span> |  <span className="no"><Icon icon="xmark" /></span> |
  | 托管标注服务                  | <span className="yes"><Icon icon="check" /></span> |  <span className="no"><Icon icon="xmark" /></span> |  <span className="no"><Icon icon="xmark" /></span> |
  | Python 和 TypeScript SDK | <span className="yes"><Icon icon="check" /></span> | <span className="yes"><Icon icon="check" /></span> | <span className="yes"><Icon icon="check" /></span> |
  | AI 助手 MCP 服务器           | <span className="yes"><Icon icon="check" /></span> |  <span className="no"><Icon icon="xmark" /></span> |  <span className="no"><Icon icon="xmark" /></span> |
</div>

<Tip>
  对于目前使用 Foxglove 或 Rerun 进行可视化的团队，Avala 提供相同的回放和渲染功能——加上标注工具、质量控制和导出管道，让您在一个平台上从原始数据到已标注的训练集。
</Tip>

## 查看器

<CardGroup cols={3}>
  <Card title="多传感器查看器" icon="display" href="/docs/visualization/multi-sensor-viewer">
    MCAP/ROS 回放，支持 8 种面板类型、自动 topic 检测和可配置布局，适用于摄像头、LiDAR、雷达和 IMU 数据。
  </Card>

  <Card title="3D 点云查看器" icon="cube" href="/docs/visualization/3d-point-cloud-viewer">
    GPU 加速点云渲染，支持 6 种可视化模式、视锥体裁剪、LOD 和 LiDAR 到摄像头投影。
  </Card>

  <Card title="Gaussian Splat 查看器" icon="circle-nodes" href="/docs/visualization/gaussian-splat-viewer">
    WebGPU 渲染的 3D Gaussian Splat 场景，支持场景层次、属性面板和实时统计。
  </Card>
</CardGroup>

## 下一步

<CardGroup cols={2}>
  <Card title="MCAP 和 ROS" icon="file" href="/docs/visualization/mcap-ros/overview">
    支持的消息类型、topic 模式以及如何准备您的录制。
  </Card>

  <Card title="面板参考" icon="table-columns" href="/docs/visualization/panels/image-panel">
    每种面板类型的详细文档：图像、点云、图表、地图、日志和原始消息。
  </Card>

  <Card title="渲染模式" icon="palette" href="/docs/visualization/rendering/visualization-modes">
    深入了解 6 种点云可视化模式及每种的使用时机。
  </Card>

  <Card title="标注工具" icon="pen-to-square" href="/docs/annotation/guides/annotation-tools">
    探索数据后，使用 7 种专业标注工具开始标注。
  </Card>
</CardGroup>