Webviz

Drag and drop your own bag files into Webviz to explore your robotics data.

View a demo of Webviz in action here.

Webviz is a web-based application for playback and visualization of ROS bag files. This repository also contains some libraries that can be used independently to build web-based visualization tools.

webviz-core (homepage, tool, github): A tool to inspect ROS bags.
regl-worldview (homepage, npm, github): React library for rendering 2D and 3D scenes using regl.
react-key-listener (npm, github): React component for handling keyboard events, without interfering with editable fields and buttons.
@cruise-automation/hooks (npm, github): A list of resusable React hooks.
@cruise-automation/button (npm, github): React button component that supports animated progress for destructive actions, "pulse" animation, and Bulma classes.
@cruise-automation/tooltip (npm, github): React component that uses popper.js to add rich, customizable tooltips to DOM elements.

Please see the individual package READMEs for details on how to install and use them.

Developing

npm run bootstrap in the root directory to install dependencies.
npm run docs to run the docs app (e.g. go to http://localhost:8080/try to open Webviz).
npm run build to run a single build or npm run watch to watch and build.
npm run storybook to run storybook.
npm run screenshot-debug to generate screenshots from stories.
npm run lint to run the linters (and npm run lint:fix to automatically fix issues).
npm run flow to run Flow.
npm run flow-typed-rebuild to update the flow-typed definitions (any time when changing packages).
npm test to run tests.

If you have the right permissions, you can publish:

npm run publish to publish npm packages.
npm run docs-deploy to deploy that statically hosted website (this is also done automatically in CI on the master branch).