Webviz - ROS可视化开源项目 - 基本使用指南

一. 进入Webviz网站

使用Webviz工具备两种方式，须要特别注意的是，二者方式都须要下载Chrome浏览器

1. 直接进入官方在线网站 https://webviz.io/app/ （因为网站服务器在国外，国内使用体验不佳）

2. 在GitHub上下载开源项目进行本地构建（可参考博客Webviz - ROS可视化开源项目 - 本地构建教程）

二. 基本使用

Webviz支持两种可视化的方式：ROS bag files 回放 和 ROS bridge 实时监测。

1. ROS bag files 回放

第一步，得到ROS bag文件：

#运行ROS
……
#查看当前全部topic
rostopic list -v
#记录指定的topic
rosbag record /topic1 /topic2
#记录全部的topic
rosbag record -a

第二步，将ROS bag文件拖放到Webviz网站界面：

2. ROS bridge 实时监测

第一步，安装ROS bridge：

sudo apt-get install ros-<rosdistro>-rosbridge-suite

第二步，启动ROS bridge：

启动rosbridge后，默认在9090端口创建WebSocket链接（与Webviz默认端口一致，不须要更改）

source /opt/ros/<rosdistro>/setup.bash
roslaunch rosbridge_server rosbridge_websocket.launch

第三步，启动您的ROS程序：

三. 自定义功能

1. 自定义功能窗口

点击设置按钮 ➡ 点击Change panel ➡ 根据须要选择功能窗口便可

2. 保存/加载自定义布局

点击设置按钮 ➡ 点击import/export panel setting ➡ 选择 copy 或 粘贴自定义配置 ➡ 选择 Apply 将设置应用到网站中

（须要注意的是，若是要改变总体布局，请选择下图右上角的设置按钮；若要改变单个窗口布局，请选择上图的设置按钮）

四. 经常使用功能简介

1. 监控并可视化ROS Messages

2. 监控ROS Topic内信息变化并绘图

3. 监控并显示ROS图像信息

4. 回放ROS日志信息

附录

下面是一个包含经常使用功能窗口的配置，可经过上面提到的方法导入到本身的面板上进行预览和进一步修改

{
  "layout": {
    "direction": "row",
    "first": {
      "direction": "column",
      "first": {
        "direction": "row",
        "first": "DiagnosticSummary!3edblo1",
        "second": "StateTransitions!3c71bze"
      },
      "second": "Plot!3s13ldj",
      "splitPercentage": 37.359550561797754
    },
    "second": {
      "direction": "row",
      "first": {
        "direction": "column",
        "first": "RosOut!1f38b3d",
        "second": "RawMessages!2d7jlx6"
      },
      "second": "3D Panel!1my2ydk",
      "splitPercentage": 50
    },
    "splitPercentage": 33.3333333333
  },
  "savedProps": {
    "StateTransitions!3c71bze": {
      "paths": [
        {
          "value": "/move_base/status.status_list[:]{goal_id==0}.status",
          "timestampMethod": "receiveTime"
        }
      ]
    },
    "Plot!3s13ldj": {
      "paths": [
        {
          "value": "/odom.twist.twist.linear.x",
          "enabled": true,
          "timestampMethod": "receiveTime"
        },
        {
          "value": "/odom.twist.twist.linear.y",
          "enabled": true,
          "timestampMethod": "receiveTime"
        }
      ],
      "minYValue": "",
      "maxYValue": "",
      "showLegend": true,
      "xAxisVal": "timestamp"
    },
    "RosOut!1f38b3d": {
      "searchTerms": [
        "/gazebo",
        "/rviz",
        "/move_base"
      ],
      "minLogLevel": 8,
      "topicToRender": "/rosout"
    },
    "RawMessages!2d7jlx6": {
      "topicPath": "/camera/depth/image_raw",
      "diffTopicPath": "",
      "diffMethod": "custom",
      "diffEnabled": false,
      "showFullMessageForDiff": false
    },
    "3D Panel!1my2ydk": {
      "checkedNodes": [
        "/amcl/parameter_descriptions",
        "/amcl/parameter_updates",
        "/amcl_pose",
        "/camera/depth/camera_info",
        "/camera/depth/image_raw",
        "/camera/depth/points",
        "/camera/parameter_descriptions",
        "/camera/parameter_updates",
        "/camera/rgb/camera_info",
        "/camera/rgb/image_raw",
        "/camera/rgb/image_raw/compressed",
        "/camera/rgb/image_raw/compressed/parameter_descriptions",
        "/camera/rgb/image_raw/compressed/parameter_updates",
        "/camera/rgb/image_raw/compressedDepth/parameter_descriptions",
        "/camera/rgb/image_raw/compressedDepth/parameter_updates",
        "/camera/rgb/image_raw/theora",
        "/camera/rgb/image_raw/theora/parameter_descriptions",
        "/camera/rgb/image_raw/theora/parameter_updates",
        "/clock",
        "/cmd_vel_mux/active",
        "/cmd_vel_mux/input/navi",
        "/cmd_vel_mux/parameter_descriptions",
        "/cmd_vel_mux/parameter_updates",
        "/gazebo/link_states",
        "/gazebo/model_states",
        "/gazebo/parameter_descriptions",
        "/gazebo/parameter_updates",
        "/gazebo_gui/parameter_descriptions",
        "/gazebo_gui/parameter_updates",
        "/joint_states",
        "/map",
        "/map_metadata",
        "/mobile_base/commands/velocity",
        "/mobile_base/sensors/imu_data",
        "/mobile_base_nodelet_manager/bond",
        "/move_base/DWAPlannerROS/cost_cloud",
        "/move_base/DWAPlannerROS/global_plan",
        "/move_base/DWAPlannerROS/local_plan",
        "/move_base/DWAPlannerROS/parameter_descriptions",
        "/move_base/DWAPlannerROS/parameter_updates",
        "/move_base/DWAPlannerROS/trajectory_cloud",
        "/move_base/NavfnROS/plan",
        "/move_base/current_goal",
        "/move_base/feedback",
        "/move_base/global_costmap/costmap",
        "/move_base/global_costmap/costmap_updates",
        "/move_base/global_costmap/footprint",
        "/move_base/global_costmap/inflation_layer/parameter_descriptions",
        "/move_base/global_costmap/inflation_layer/parameter_updates",
        "/move_base/global_costmap/obstacle_layer/parameter_descriptions",
        "/move_base/global_costmap/obstacle_layer/parameter_updates",
        "/move_base/global_costmap/parameter_descriptions",
        "/move_base/global_costmap/parameter_updates",
        "/move_base/global_costmap/static_layer/parameter_descriptions",
        "/move_base/global_costmap/static_layer/parameter_updates",
        "/move_base/goal",
        "/move_base/local_costmap/costmap",
        "/move_base/local_costmap/costmap_updates",
        "/move_base/local_costmap/footprint",
        "/move_base/local_costmap/inflation_layer/parameter_descriptions",
        "/move_base/local_costmap/inflation_layer/parameter_updates",
        "/move_base/local_costmap/obstacle_layer/parameter_descriptions",
        "/move_base/local_costmap/obstacle_layer/parameter_updates",
        "/move_base/local_costmap/parameter_descriptions",
        "/move_base/local_costmap/parameter_updates",
        "/move_base/parameter_descriptions",
        "/move_base/parameter_updates",
        "/move_base/result",
        "/move_base/status",
        "/move_base_simple/goal",
        "/navigation_velocity_smoother/parameter_descriptions",
        "/navigation_velocity_smoother/parameter_updates",
        "/navigation_velocity_smoother/raw_cmd_vel",
        "/odom",
        "/particlecloud",
        "/rosout",
        "/rosout_agg",
        "/tf",
        "/tf_static",
        "/turtlebot/laser/scan",
        "name:Topics"
      ],
      "expandedNodes": [
        "name:Topics"
      ],
      "followTf": "map",
      "cameraState": {
        "targetOffset": [
          0,
          0,
          0
        ]
      },
      "modifiedNamespaceTopics": [],
      "pinTopics": false,
      "topicSettings": {},
      "autoSyncCameraState": false,
      "topicGroups": [
        {
          "displayName": "Imported Group",
          "visibilityByColumn": [
            true,
            true
          ],
          "expanded": true,
          "items": []
        }
      ],
      "savedPropsVersion": 14
    }
  },
  "globalVariables": {},
  "userNodes": {},
  "linkedGlobalVariables": [],
  "playbackConfig": {
    "speed": 0.2
  }
}