Foxglove Studio
Foxglove Studio与webviz使用起来非常类似 去可以直接使用web也可以下载安装包
Foxglove Studio不提供源码
安装包下载地址： https://foxglove.dev/download
web端访问 https://studio.foxglove.dev/
点击 open connection
点rosbrideg 点击 open
不要忘记启动以下
启动 本机 10.6.162.111 仿真环境：
roslaunch turtlebot3_gazebo turtlebot3_house.launch
roslaunch turtlebot3_teleop turtlebot3_teleop_key.launch
roslaunch turtlebot3_navigation turtlebot3_navigation.launch map_file:=/home/sukai/slam/map/map_1.yaml启动
roslaunch rosbridge_server rosbridge_websocket.launch好了可以使用了：
桌面版的界面与web版一致。
或者安装
sudo apt install ros-noetic-foxglove-bridge启动：
rosrun foxglove_bridge foxglove_bridge启动后终端还报了个错：
[ERROR] [1673434716.779121307]: Skipped loading plugin with error: XML Document '/opt/ros/noetic/share/tf2_server/tf2_server_test_nodelets.xml' has no Root Element. This likely means the XML is malformed or missing..
但还年能用。
选择 Foxglove Websocket 连接ros了
webviz安装，docker安装可正常使用
换源加速
更换npm源为淘宝的源
npm config set registry https://registry.npm.taobao.org在 ~/.bashrc 中添加下列语句
export NVM_NODEJS_ORG_MIRROR=https://npm.taobao.org/mirrors/nodeWebviz项目暂时仅支持 node10 和 node11，高版本的 node 会出现编译错误。
查看可安装的node版本
nvm ls-remote安装指定版本的node
nvm install 10.19.0查看当前的node版本
nvm current查看已安装的node版本
nvm list选择需要的node版本
nvm use 10.19.0检查是否配置成功
npm config get registry 克隆代码
git clone https://github.com/cruise-automation/webviz.gitcd webviz/手动安装node-sass
npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/npm install node-sassnpm run bootstrap 执行脚本安装项目依赖
npm run bootstrap 编译项目
npm run build 使用Webviz
运行rosbridge_websocket
roslaunch rosbridge_server rosbridge_websocket.launch在webviz根目录执行启动
npm run docsnpm install node-sass 报错：
TypeError: Object.fromEntries is not a function
at Object.<anonymous> (/home/sukai/workspace/workspace_ros_car_noetic/webviz/node_modules/@npmcli/fs/lib/fs.js:6:23)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
at Object.<anonymous> (/home/sukai/workspace/workspace_ros_car_noetic/webviz/node_modules/@npmcli/fs/lib/index.js:2:6)
at Module._compile (internal/modules/cjs/loader.js:778:30)
解决办法：
先清依赖残留，否则安装不上
npm rebuild node-sass
npm uninstall node-sass
安装 4.14的
npm install node-sass@4.14
参考博客：https://blog.csdn.net/qq_44226094/article/details/117792206
npm run bootstrap 报错：
lerna ERR! npm install --global-style --legacy-peer-deps exited 1 in 'webviz-core'
lerna ERR! npm install --global-style --legacy-peer-deps stderr:
npm WARN read-shrinkwrap This version of npm is compatible with lockfileVersion@1, but package-lock.json was generated for lockfileVersion@2. I'll try to do my best with it!
npm WARN tar ENOENT: no such file or directory, open '/home/sukai/workspace/workspace_ros_car_noetic/webviz/packages/webviz-core/node_modules/.staging/prettier-e8261b17/parser-angular.js'
npm WARN @cruise-automation/button@0.0.7 requires a peer of react@16.x but none is installed. You must install peer dependencies yourself.
【***】 npm WARN styled-components@3.4.10 requires a peer of react@>= 0.14.0 < 17.0.0-0 but none is installed. You must install peer dependencies yourself.
npm WARN webviz-core@0.0.1 No repository field.
npm ERR! Error while executing:
npm ERR! /usr/bin/git ls-remote -h -t ssh://git@github.com/davidswinegar/react-document-events.git
npm ERR!
npm ERR! git@github.com: Permission denied (publickey).
解决：
npm install react@16.10.2 --savenpm run bootstrap 其它各种依赖报错：
例子：
npm ERR! /usr/bin/git ls-remote -h -t ssh://git@github.com/davidswinegar/Chart.js.git
npm ERR!
npm ERR! git@github.com: Permission denied (publickey).
npm ERR! fatal: 无法读取远程仓库。
npm ERR!
npm ERR! 请确认您有正确的访问权限并且仓库存在。
npm ERR!
npm ERR! exited with error code: 128
npm ERR! A complete log of this run can be found in:
npm ERR! /home/sukai/.npm/_logs/2023-01-11T02_25_33_601Z-debug.log
解决：
暂时没法解决！
尝试：
webviz/packages/webviz-core
gedit package-lock.json 把
搜索 git+ssh://git@github.com 替换：https://github.com但是还是没能解决问题
npm install 安装或者 npm run bootstrap 卡在某一行时请删除以下后重新执行命令
删除 node_modules package-lock.json
docer安装Webviz
后来我用了docer成功使用：
一.准备Webviz的镜像
docker pull cruise/webviz
运行拉下的容器 8080端口太常用了容易冲突我们用7070映射8080
docker run -p 7070:8080 cruise/webviz
http://127.0.0.1:7070/
我电脑本机的 ipv4地址：10.6.162.111
游览器： http://10.6.162.111:7070
游览器： http://10.9.162.111:7070/?demo 官方例子
启动 本机 10.6.162.111 仿真环境：
roslaunch turtlebot3_gazebo turtlebot3_house.launch
roslaunch turtlebot3_teleop turtlebot3_teleop_key.launch
roslaunch turtlebot3_navigation turtlebot3_navigation.launch map_file:=/home/sukai/slam/map/map_1.yaml启动 roslaunch rosbridge_server rosbridge_websocket.launch
<launch>
<!-- sudo apt-get install ros-melodic-rosbridge-suite -->
<!-- roslaunch rosbridge_server rosbridge_websocket.launch -->
<include file="$(find rosbridge_server)/launch/rosbridge_websocket.launch" >
<!-- <arg name="port" value="8080"/>-->
</include>
<!-- sudo apt-get install ros-noetic-tf2-web-republisher -->
<!-- rosrun tf2_web_republisher tf2_web_republisher -->
<node pkg="tf2_web_republisher" type="tf2_web_republisher" name="tf2_web_republisher" output="screen" >
</node>
<!-- sudo apt-get install ros-noetic-web-video-server -->
<!-- rosrun web_video_server web_video_server -->
<node pkg="web_video_server" type="web_video_server" name="web_video_server" output="screen" >
</node>
</launch>
能够正常使用，想使用熟练就需要下功夫了
但是雷达点显示不出来报：
/scan missing transforms to root frame map from frames
要改源码就不能用docker ，现在docker进不了终端；
Webviz
…详情请参照古月居
原文链接：https://blog.csdn.net/lovely_yoshino/article/details/127617733文章来源：https://www.toymoban.com/news/detail-452460.html
https://webviz.io/文章来源地址https://www.toymoban.com/news/detail-452460.html
到了这里，关于webviz安装，docker安装可正常使用与Foxglove Studio的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
