(!) Please ask about problems and questions regarding this tutorial on answers.ros.org. Don't forget to include in your question the link to this page, the versions of your OS & ROS, and also add appropriate tags.

Writing a URDF parser with roslibjs

Description: This tutorial shows you how to fetch a URDF model of a robot and parse it with roslibjs.

Keywords: roslibjs, web interface, urdf, Robot Web Tools

Tutorial Level: BEGINNER

Getting Started

This tutorial involves writing a single HTML file, which will contain the HTML and JavaScript needed to get a URDF model from ROS. To begin, create a file urdf.html with your favorite text editor.

The complete code for this tutorial can be found in the roslibjs repo.

The HTML Code

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <meta charset="utf-8" />
   5 <script type="text/javascript" src="http://cdn.robotwebtools.org/EventEmitter2/current/eventemitter2.js"></script>
   6 <script type="text/javascript" src="http://cdn.robotwebtools.org/roslibjs/current/roslib.js"></script>
   7 
   8 <script type="text/javascript">
   9   var ros = new ROSLIB.Ros({
  10     url : 'ws://localhost:9090'
  11   });
  12 
  13   var param = new ROSLIB.Param({
  14     ros : ros,
  15     name : 'robot_description'
  16   });
  17 
  18   param.get(function(param) {
  19     var urdfModel = new ROSLIB.UrdfModel({
  20       string : param
  21     });
  22     console.log(urdfModel);
  23   });
  24 
  25   ros.on('connection', function() {
  26     console.log('Connected to websocket server.');
  27   });
  28 
  29   ros.on('error', function(error) {
  30     console.log('Error connecting to websocket server: ', error);
  31   });
  32 
  33   ros.on('close', function() {
  34     console.log('Connection to websocket server closed.');
  35   });
  36 </script>
  37 </head>
  38 
  39 <body>
  40   <h1>URDF Parsing Example</h1>
  41   <p>Check the JavaScript console for the output.</p>
  42 </body>
  43 </html>

Code Explanation

Now that we have an example, let's look at each component.

   9   var ros = new ROSLIB.Ros({
  10     url : 'ws://localhost:9090'
  11   });

We need to create a Ros node object to communicate with a rosbridge server. In this example, the script will connect to localhost on the default port of 9090.

  13   var param = new ROSLIB.Param({
  14     ros : ros,
  15     name : 'robot_description'
  16   });

When running the roslaunch instructions for pr2_description below, the URDF of the PR2 is stored as a param labeled "robot_description" in the Parameter Server.

  18   param.get(function(param) {
  19     var urdfModel = new ROSLIB.UrdfModel({
  20       string : param
  21     });
  22     console.log(urdfModel);
  23   });

The "robot_description" param is retrieved from the Parameter Server. The value, if it exists, is a string containing the URDF XML.

The ROSLIB.UrdfModel is responsible for parsing the string. It takes the XML in the constructor, parses it, and provides access to each link, mesh, etc. Check out the ROSLIB.UrdfModel docs for the options and functions available.

  25   ros.on('connection', function() {
  26     console.log('Connected to websocket server.');
  27   });

This adds a listener for a connection event to the ros object. The following two blocks do the same for error and close events. This way, we can monitor the connection to the rosbridge server.

If interested in visualizing the robot model from the URDF, there's a ros3djs tutorial, which extends this tutorial.

Running the Example

At this point we are ready to run the example. To do so, you will need to have installed the following packages:

  • ros-groovy-ros-base (basic ROS installation)
  • ros-groovy-rosbridge-server (rosbridge_server)

  • ros-groovy-pr2-common (Contains the PR2 model)

To begin, we will launch ROS. To do so, run the following in a terminal:

  • roscore

Next, we'll start the PR2 Description node, which sets the URDF model:

  • roslaunch pr2_description upload_pr2.launch

Once everything is running, we can launch the rosbridge v2.0 server with the following:

  • roslaunch rosbridge_server rosbridge_websocket.launch

Finally, you are now ready to bring up your HTML page in a web browser. You can open up the file directly in the browser without running a web server. The data is outputted to the browser's Web Console.

Wiki: roslibjs/Tutorials/UrdfParsing (last edited 2014-06-12 14:52:53 by NilsBerg)