ROS3Djs in combination with ROS2

[davidDS96]

Hello all,

I was wondering if the ROS3Djs framework is also supported for usage with ROS2.

Anyone some news on that?

Best regards

[MatthijsBurgh]

It depends on the support by roslib(https://github.com/RobotWebTools/roslibjs). The currently released version of roslib does support all the ROS2 interfaces except actions.

[davidDS96]

We were testing if we could visualise a PointCloud2 message in the browser using ros3Djs.
We have verified that the PointCloud message arrives properly. However, while the 3D canvas is displayed, no PointCloud is visible. Looking at the errors, we suspect that the problem comes from the tf2_web_republisher package:

[rosbridge_websocket-1] [INFO] [1710498853.867756324] [rikkert.rosbridge_websocket]: Client connected. 1 clients total.
[rosbridge_websocket-1] [ERROR] [1710498853.879284256] [rikkert.rosbridge_websocket]: [Client 91d04f66-b86c-4754-8333-0fc7748421c6] [id: advertise:/tf2_web_republisher/goal:1] advertise: Unable to import msg class TFSubscriptionActionGoal from package tf2_web_republisher. Caused by module 'tf2_web_republisher.msg' has no attribute 'TFSubscriptionActionGoal'
[rosbridge_websocket-1] [ERROR] [1710498853.880151856] [rikkert.rosbridge_websocket]: [Client 91d04f66-b86c-4754-8333-0fc7748421c6] [id: subscribe:/tf2_web_republisher/feedback:3] subscribe: Unable to import msg class TFSubscriptionActionFeedback from package tf2_web_republisher. Caused by module 'tf2_web_republisher.msg' has no attribute 'TFSubscriptionActionFeedback'
[rosbridge_websocket-1] [INFO] [1710498853.881981997] [rikkert.rosbridge_websocket]: [Client 91d04f66-b86c-4754-8333-0fc7748421c6] Subscribed to /rs_bpearl/pointcloud
[rosbridge_websocket-1] [ERROR] [1710498854.026874867] [rikkert.rosbridge_websocket]: [Client 91d04f66-b86c-4754-8333-0fc7748421c6] [id: publish:/tf2_web_republisher/goal:5] publish: Cannot infer topic type for topic /tf2_web_republisher/goal as it is not yet advertised

Do you have any suggestions on how to fix this problem?

[MatthijsBurgh]

That is not compatible with ROS2 (yet)

[davidDS96]

Ok, that's too bad.
Is there any indication when this comes available?

[MatthijsBurgh]

That repo, tf2_web_republisher is actually archived. So nobody is maintaining it for now. So I think you need to refactor it for ROS2. But than you also need an unreleased version of roslibjs, which does support ROS2 actions.

[davidDS96]

Ok.
I see in the roslibjs repo (https://github.com/RobotWebTools/roslibjs/tree/develop/examples) that some examples are added 2 weeks ago with regards to ROS2 and action support. However, tf and urdf have not been updated in the past 10 months? Is there any chance an update of these will occur?

[MatthijsBurgh]

I can't say. You need to ask @EzraBrooks and @sea-bass .

[sea-bass]

We are working on porting the tf2_web_republisher. But this is a set of open source repos, so anyone is always welcome to contribute!

[davidDS96]

I found the following repository (https://github.com/Wisc-HCI/tf2_web_republisher_py) containing a port of the tf2_web_republisher for ROS2. Does anyone have any experience using this package?

[sea-bass]

I can only speak to this fork from @pac48 which I've seen work: https://github.com/pac48/tf2_web_republisher ... but I am unsure if it's in a fully ready state at the moment. You're welcome to try!

[davidDS96]

Ok, nice. I will take a look at it after the Easter holidays!

[davidDS96]

Hi everyone!

After some busy days, I've found the time to test the tf2_web_republisher fork for visualising a 3D pointcloud using ROS3Djs.

To visualise a 3D pointcloud in the browser, I've used the following Javascript:

<script type="text/javascript" type="text/javascript">

    const ros = new ROSLIB.Ros({
        url: 'ws://192.168.69.20:9090'
    })


    // Create the main viewer.
    const viewer = new ROS3D.Viewer({
    divID : 'viewer',
    width : 800,
    height : 600,
    antialias : true
    });

    // Setup a client to listen to TFs.
    const tfClient = new ROSLIB.TFClient({
        ros : ros,
        angularThres : 0.01,
        transThres : 0.01,
        rate : 10.0
    });

    var cloudClient = new ROS3D.PointCloud2({
        ros: ros,
        tfClient: tfClient,
        rootObject: viewer.scene,
        topic: '/rs_bpearl/pointcloud',
        material: { size: 0.1, color: 0xff00ff }
    });

</script>

I have the following terminal output:

[rosbridge_websocket-4] [INFO] [1712839238.161715175] [rikkert.rosbridge_websocket]: Rosbridge WebSocket server started on port 9090
[rosbridge_websocket-4] [INFO] [1712839243.652251997] [rikkert.rosbridge_websocket]: Calling services in existing thread
[rosbridge_websocket-4] [INFO] [1712839243.653098323] [rikkert.rosbridge_websocket]: Sending action goals in existing thread
[rosbridge_websocket-4] [INFO] [1712839243.654413931] [rikkert.rosbridge_websocket]: Client connected. 1 clients total.
[rosbridge_websocket-4] [ERROR] [1712839243.688801503] [rikkert.rosbridge_websocket]: [Client 0cbedeb3-be59-4acb-8cec-54be58ccef25] [id: advertise:/tf2_web_republisher/goal:1] advertise: Unable to import tf2_web_republisher.msg from package tf2_web_republisher. Caused by: No module named 'tf2_web_republisher'
[rosbridge_websocket-4] [ERROR] [1712839243.697831669] [rikkert.rosbridge_websocket]: [Client 0cbedeb3-be59-4acb-8cec-54be58ccef25] [id: subscribe:/tf2_web_republisher/feedback:3] subscribe: Unable to import tf2_web_republisher.msg from package tf2_web_republisher. Caused by: No module named 'tf2_web_republisher'
[rosbridge_websocket-4] [INFO] [1712839243.752100615] [rikkert.rosbridge_websocket]: [Client 0cbedeb3-be59-4acb-8cec-54be58ccef25] Subscribed to /rs_bpearl/pointcloud
[rosbridge_websocket-4] [ERROR] [1712839243.913545312] [rikkert.rosbridge_websocket]: [Client 0cbedeb3-be59-4acb-8cec-54be58ccef25] [id: publish:/tf2_web_republisher/goal:5] publish: Cannot infer topic type for topic /tf2_web_republisher/goal as it is not yet advertised

and unfortunately no pointcloud is visualised.

[pac48]

@davidDS96 You will also need this fork on roslibjs https://github.com/pac48/roslibjs/tree/pr-add-TF2Client in order to use the tf2_web_republisher. I added a class called TF2Client that you need to use. Also, make sure you have the rosidl-generator-py package installed.

[DeveloperKSH]

@pac48 I would appreciate it if you could let me know how to use the rosidl-generator-py package after installing it.

[davidDS96]

@pac48 I tried to integrate your fork of roslibjs into my project but I am running into a few problems with regards to Javascript: several imports are not working or are not found
For instance:

import assign from "object-assign"

is throwing an error for not finding the package. Unfortunately, this is only one of the error messages I have.

[pac48]

@davidDS96 You will need to use the fork in your package.json, something like this "roslib": "github:pac48/roslibjs#pr-add-TF2Client" Then run pnpm install. Although, I will make a PR to merge it into this repo at some point.

@DeveloperKSH That package is used by colcon build to generate the Python messages for custom message packages. You should not need to do anything special after it is installed.

[Nick-PAN]

@pac48 I would appreciate it if you tell me how to build the roslibjs? I want to use it with ros3djs, will it work?

[pac48]

@Nick-PAN You should be able to clone the roslibjs repo and run pnpm install to install of of its dependencies. Then, you should be able to add it to your project by running pnpm install /path/to/roslibjs. That is if you want to make changes to it. Otherwise, you can probably just add it to your package.json like this "github:pac48/roslibjs#pr-add-TF2Client".

[davidDS96]

@pac48 Hi Paul! Since I'm not so familiar with Javascript development, is it maybe possible to give a step-by-step guide of how to implement your fork of the roslibjs and the roslib3Djs framework starting from a simple html file such as here: https://github.com/RobotWebTools/roslibjs/blob/develop/examples/simple.html?

[chanhhoang99]

Hello @pac48 , could you share your roslibjs prebuild version ?

[Nick-PAN]

Thank you @pac48 ! I solved my problem by your reply, and displayed the Universal Robot model on web successfully.

@Nick-PAN You should be able to clone the roslibjs repo and run pnpm install to install of of its dependencies. Then, you should be able to add it to your project by running pnpm install /path/to/roslibjs. That is if you want to make changes to it. Otherwise, you can probably just add it to your package.json like this "github:pac48/roslibjs#pr-add-TF2Client".

[kavikode]

How do we install and run ROS3Djs with ROS2 Humble to visualize a URDF and interact with the joint state publisher in the browser because there are no pre-built libraries existing?

@pac48 @Nick-PAN any example repos for reference please?

Following the above, I have the following:
cd /path/to

git clone -b pr-add-TF2Client https://github.com/pac48/roslibjs.git
cd /path/to/roslibjs restart

npm install
npm audit fix --force

cd /path/to/roslibjs/examples

ros2 launch rosbridge_server rosbridge_websocket_launch.xml

python3 -m http.server

The simple URDF HTML file displays connected. However, I do not see the robot model on the webpage.

In particular, I'm launching the ros2 launch tiago_gazebo tiago_gazebo.launch.py is_public_sim:=True moveit:=True world_name:=pick from the repo link: https://github.com/pal-robotics/tiago_simulation

How can I display the robot model on the webpage?

For the TF2 I have used the following,
git clone https://github.com/tuxnese/tf2_web_republisher_py.git
source install/setup.bash

ros2 run tf2_web_republisher tf2_web_republisher

Please help to resolve this issue.

Thank you