ROS Resources: Documentation | Support | Discussion Forum | Index | Service Status | Q&A
Ask Your Question

roslibjs subscribe to sensor_msgs/image

asked 2017-01-20 19:09:33 -0600

Swoncen gravatar image


I couldn't find an example of how to subscribe to a sensor_msgs/image and display it in a html5 canvas. I already have a page running and I can somehow access the data, but it won't display in an image nor in a html5 canvas. This is an excerpt of my test code:

   var imagedata = "data:image/jpeg;base64," +;
   document.getElementById('xy_image').setAttribute('src', imagedata);

First of all: how can I access the frames without subscribing to the topic every time and unsubscribing to it again? Second: The seems correct, but the header doesnt work and the image is not displayed. I tried png as well, with no success. I would be happy if you could help me out - maybe with a basic example.

Thanks in advance

edit retag flag offensive close merge delete

1 Answer

Sort by ยป oldest newest most voted

answered 2017-01-22 15:14:32 -0600

Swoncen gravatar image

updated 2017-01-22 15:32:11 -0600

gvdhoorn gravatar image

Found a solution:

var imageTopic = new ROSLIB.Topic({
    ros : ros,
    name : '/camera/image/compressed',
    messageType : 'sensor_msgs/CompressedImage'

the compressed image can be retrieved via:

var imagedata = "data:image/jpg;base64," +;
edit flag offensive delete link more


I've converted your comment to an answer, as it would seem you have answered your own question (good!).

Could you accept your own answer? You can do so by ticking the checkmark to the left of the answer.

gvdhoorn gravatar image gvdhoorn  ( 2017-01-22 15:31:54 -0600 )edit

Your Answer

Please start posting anonymously - your entry will be published after you log in or create a new account.

Add Answer

Question Tools



Asked: 2017-01-20 19:09:33 -0600

Seen: 1,999 times

Last updated: Jan 22 '17