Introduction
Extend Foxglove's capabilities with custom extensions to better support your team's unique workflows. Build bespoke panels, convert custom messages to Foxglove-supported schemas, and alias topic names for easy visualization.
Once you've developed and installed your extension, you can open your app settings to display all available and installed extensions.
Custom panels
While Foxglove offers a suite of built-in panels for robotics data visualization and debugging, many users have domain-specific needs that our out-of-the-box offering does not address.
Custom panel extensions allow you to build an entire panel. Custom panels can subscribe to messages on various topics, advertise and publish, and display the message information in whatever form is most relevant for your workflow.
Custom panels are ideal when your visualization or interaction needs are bespoke and not easily solved via one of the built-in panels.
Links and resources
Message converters
Message converter extensions allow you to convert messages from one form to another. There are two types of converters:
- Schema converters — convert messages from one schema to another. Ideal when there is a 1:1 relationship between some internal schema and a well-known Foxglove schema. For example, converting a custom GPS message to
foxglove.LocationFixfor visualization in the Map panel. - Topic converters — produce new topics from one or more input topics. They are more flexible than schema converters but also have more surface area to implement.
| Schema converter | Topic converter | |
|---|---|---|
| Use case | Visualize custom messages using built-in panels | Processing and creating new data |
| Conversion type | 1:1 schema mapping | Arbitrary topic generation |
| Input source | Any schema | One or more specific topics |
| State handling | Stateless | Stateful supported |
| Output | Well-known schema | Custom or well-known schemas |
Message converters run on-demand only when the topic is subscribed to by a panel.
Links and resources
- Guide: Create schema converter
- Guide: Create topic converter
- Write a message converter extension (Map panel)
- Write a message converter extension (3D panel)
Topic aliases
Topic alias extensions allow you to alias topics in your data source to new topics. Foxglove panels can subscribe to both the aliased topics and the original data source's topics.
Writing an extension
You can write extensions in JavaScript or Typescript and package them into .foxe files. You can distribute these files privately to your Foxglove organization or publicly via our registry - installing extensions via the registry is only supported on the desktop app. A single extension can include multiple panels or converters.
Foxglove provides a set of starter templates and commands in the create-foxglove-extension package to simplify authoring an extension.
Requirements:
To set up your extension project, navigate to the directory where you'll want your source code to live and run the following command in a Terminal window:
npm init foxglove-extension@latest my-extension-name
This will set up an extension directory structure. The entrypoint of your extension is the index.ts file.
The entrypoint script MUST export an ExtensionModule — that is, a single activate function which accepts a single ExtensionContext argument.