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
  }
}