JS API: Camera Integration

<script src="/networktables/camera.js"></script>


These functions require jQuery to be loaded first!


This useful helper function will create an img or svg element inside of the div element that you specify. The image will only be connected when a successful NetworkTables connection is detected, to prevent timeout issues. Additionally, this function will attempt to verify that the webcam server is actually up and running before creating the image.

You should provide an object with an object that can have the following attributes:

  • container – Where to draw things
  • proto – optional, defaults to http://
  • host – optional, if null will use robot’s autodetected IP
  • port – optional, webserver port
  • image_url – path to mjpg stream
  • data_url – a file or page that must exist on the webcam server
  • wait_img – optional image to show when not connected
  • error_img – optional image to show when not connected
  • attrs – optional attributes to set on svg or img element
  • nosim – if true, connect to the webcam in simulation mode

For example, to connect to mjpg-streamer on the RoboRIO:

    container: '#my_div_element',
    port: 5800,
    image_url: '/?action=stream',
    data_url: '/program.json',
    attrs: {
        width: 640,
        height: 480


This has only been tested with mjpg-streamer, but should work for other HTTP webcams as well.