Visualization / Transforms with rosbridge and erratic [closed]

edit

I'm trying to create a website that displays the current progress of a robot (in this case erratic) running SLAM. With rosbridge I've been able to set up the subscriptions that I need, I think and I can draw all of the data in a similar way that rviz does.

The trouble is that each topic I've subscribed to has a lot of fields and I'm not sure how to get the transforms from each frame to line up when visualizing the slam map, the senses obstacles and the robot.

The topics of interest are:

/move_base_node/local_costmap/robot_footprint
/move_base_node/local_costmap/inflated_obstacles
/map

Obviously it makes sense that the topics under /move_base_node/local_costmap are in the same frame, but obviously /map is not.

Do I need to use tf to accomplish this? I couldn't find a tutorial for this kind of thing.

Any help or direction is greatly appreciated.