0. Introduction Back to main menu
Signal K InstrumentPanel is implemented as a grid with draggable & resizable cells.
Each cell also called widget is in charge of displaying the value(s) of a Signal K path.
When a new path is discovered, a new dedicated widget is created and attached to this path. It automatically becomes visible or not on the grid according to a configurable rule.
For some data, like wind, there is a composite gauge that displays several items in the same time widget.
The cells are grouped into three columns:
When the help page is displayed all buttons are disabled.
You must close the help page by clicking on the
button to reactivate them.
1. Connect to your Signal K Server Back to main menu
The Signal K server address is directly derived from your web page and InstrumentPanel automatically connects to the server.
If the Reconnecting reappears, it means that the connection to the Signal K server is broken and that InstrumentPanel is trying to reconnect automatically.
For advanced users, you can manually specify the address and the protocol to connect to your Signal K server (See: Advanced options).
2. Top Bar Buttons Back to main menu
After connecting an initial first page is auto generated with all paths known in your SignalK Server.
Signal K data items are displayed in different cells with dedicated widgets depending on their types.
Widgets are arranged on a virtual grid with vertical compaction.
Units on widgets are set to default and fetched from the server metadata.
button: Click to unlock your layout
buttons:
To switch pages, just click on the page number.
buttons:
Click on it to see a list of your current alarms.
The bell can have different colors depending on the current alert level (Emergency, Alarm, Warning, etc...).After 15 seconds without user activity, the menu will automatically hide to free up space on the screen.
A small heart and a bell (when you have active notifications) are displayed at the top right of the screen.
To make the menu reappear click on the center of the Instrumentpanel screen.
If you want the menu to disappear before the 15 seconds, depending on the size of your screen, click in the green zone:
2.1. Change Page Back to up menu / main menu
You can have up to 10 pages, each with a separate selection, configuration and layout of widgets.
To switch pages, just click on the page number or doing a horizontal swipe on the screen.
To create a new page, see:Add or Delete Pages.
2.1.1. Alarms Page Back to up menu / main menu
By clicking on the
button,
you display the list of current alarms. They are sorted by alarm level and
date when available (Emergency, Alarm, Warn, Alert, Normal, Nominal).
When you stay on the page, the alarms are no longer sorted.
To sort again, click the
button again.
When the alarm level is higher than Nominal the border of all widgets takes the color of the highest alarm.
Color code by alarm level:
: Nominal alarm level.
: Normal alarm level.
: Alert alarm level.
: Warning alarm level.
: Alarm alarm level.
: Emergency alarm level.You can hide some alarms in the settings page.
In this case, the alarm button can also display a second information.
The color of the dotted border of the
indicates that there are hidden alarms
and the maximum level of hidden alarms.
(See: Alarms Settings
2.2. Layout Back to up menu / main menu
InstrumentPanel supports several layouts. The choice of layout is selected according to 3 criteria in the following order:
You can view the name of the layout by switching to Settings mode
![]()
in the Widget settings screen.
In the example above an layout dedicated to freeboard-sk has been automatically selected.
2.2.1. Modify Layout Back to up menu / main menu
Use the
button on the main bar to unlock the layout.
When the layout is unlocked, widget background changes to yellow and features are hidden.
To return to normal mode and to lock & save the layout,
click on the
button.
2.2.2. Moving and Resizing Widgets Back to up menu / main menu
On a unlocked layout:
resize a widget by dragging the anchor located at the bottom right.
Move a widget by dragging.
The layout adjusts automatically to changes, compacting the widgets vertically.
2.2.3. Notes for iOS users Back to up menu / main menu
On an unlocked grid, to drag or to resize a widget,
first click once or twice in the center of the widget
to bring focus to it and then you can drag or resize the widget with the screen's scroll locked.
If you don't click first in the center of the widget,
the page starts scrolling before you can drag or resize the widget.
2.3. Settings Back to up menu / main menu
Use the
button to switch to settings.
In settings mode, at the top left, you will find a dropdown-list, click on the arrow to list the choices :
In setting mode, use the
button to return to the main view.
2.3.1. Customise Display screen Back to up menu / main menu
In this settings page, to access widget's parameters, click on 'edit'.
You can set:
2.3.1.1. Rule for displaying new widget Back to up menu / main menu

With this setting you can select if a new widget created will be shown or not on your grid.
three choices are available:
2.3.1.2. Hide or Show widget: Back to up menu / main menu
A common option for all widgets is the Shown on grid option
Unselect/Select checkbox to hide/show the widget on the page.
button: Hides all widgets on the current page in one operation.
button: Shows all widgets on the current page in one operation.2.3.1.3. Delete widget Back to up menu / main menu
By checking Delete you delete an existing widget associated with a Signal K path and source.
In order to delete a widget, it must first not be Displayed on the grid.
If you delete a widget that is associated to a Signal K path still present in your server, it will be automatically recreated when reloading Instrumentpanel.
button: Deletes all widgets whose "show on grid" checkbox is not checked.2.3.1.4. Unit selection Back to up menu / main menu
Most widgets have a unit selection.
Select your preferred unit from the listbox.
To make the unit change active, InstrumentPanel must be reloaded. This will be done automatically when you leave settings screens.
You will be informed by a message at the top of the screen.
2.3.1.5. Widget Specific Settings Back to up menu / main menu
Each widget type has specific settings.
2.3.1.5.1. Universal Widget (with colored zones) Back to up menu / main menu
This widget has alternative digital and analog views.
The analog view can display colored zones for value ranges.
The ranges can be based on local settings in or zones fetched from the server.
In Local mode, the zones are configured in InstrumentPanel settings panel and stored in the browser.
The configuration is limited: a single red zone from redline value to maximum value and you can set the minimum value for the gauge.
In server mode, the zones are configured by modifying the ~/.signalk/baseDeltas.json file on your Signal K server.
You can configure multiple zones, each associated with a state that has its own color.
In this case, only colors are configured in InstrumentPanel settings panel.
Changes there take effect after server restart.
batteries 1 sample baseDeltas.json:
Locate updates/meta section in your baseDeltas.json
{
"context": "vessels.self",
"updates": [
{
"meta": [
Insert content like below
{
"path": "electrical.batteries.1.voltage",
"value": {
"displayName": "battery 1",
"zones": [
{
"upper": 11.8,
"state": "alarm"
},
{
"upper": 12,
"lower": 11.8,
"state": "warn"
},
{
"upper": 14.6,
"lower": 12,
"state": "nominal"
},
{
"lower": 14.6,
"state": "alarm"
}
],
"displayScale": {
"lower": 11.5,
"upper": 15.5
}
}
}
Add , after the last } if your section is followed by another one.
Make sure the content is valid JSON.
Using an editor that validates the format is a great help !
For more information on zones see the Signal K Specification
and Server FAQ
2.3.1.5.2. Compass Widget Back to up menu / main menu
This widget has 3 displays view possible (rose/reading/digital).
Choose your preferred view by selecting the radio button.

2.3.1.5.3. Windmeter Widget: Back to up menu / main menu
This widget has only the unit selection.
Apparent Wind, True Wind over Ground and True Wind through Water values are automatically bound on widget.
2.3.1.5.4. Digital DateTime Widget: Back to up menu / main menu
This widget has only a timezone selection.
In timezone list, DST means Daylight Saving Time and displays time automatically in the timezone
set on the device running your browser.
2.3.1.5.5. Iframe Widget: Back to up menu / main menu
This widget can embed an external HTML page like Grafana, Signal K Auto-pilot,...
The configuration is manual and must be done only once on the Signal K server.
~/.signalk/baseDeltas.json file on your Signal K server.updates/value section:[
{
"context": "vessels.self",
"updates": [
{
"values": [
{
"path": "external.iframe.XXXXX",
"value": {
"src": "",
"themeKey": "", // optional
"darkValue": "", // optional
"lightValue": "" // optional
}
}
updates/meta section {
"context": "vessels.self",
"updates": [
{
"meta": [
{
"path": "external.iframe.XXXXX",
"value": {
"displayName": "my external page"
}
}
updates/value section used above Show on grid
to adjust the widget size and positionGrafana example:
allow_embedding = true [auth.anonymous] to avoid authentication in the widget &theme=dark for dark mode and &theme=light for light mode.{
"path": "external.iframe.grafana",
"value": {
"src": "http://barco.local:4000/d-solo/7v5TG3Wnk/demo-dashboard?orgId=1&refresh=10s&panelId=2",
"themeKey": "theme",
"darkValue": "dark",
"lightValue": "light"
}
}
Signal K auto-pilot example:
updates/value section
{
"path": "external.iframe.autopilot",
"value": {
"src": "http://my-signalk.local:3000/@signalk/signalk-autopilot"
}
}
...
updates/meta section
{
"path": "external.iframe.autopilot",
"value": {
"displayName": "autopilot"
}
}
2.3.1.6. Widget managed paths: Back to up menu / main menu
A widget type (compass in screenshot) can handle multiple paths.
You can discover the list of these paths by clicking on the [+] sign.

In bold, are displayed the paths that are managed by this cell.
For each path listed, a new cell will be created with this widget type only if the path exists on your Signal K server.
Clic on the list to return to the default vue.
2.3.1.7. Alarms Settings: Back to up menu / main menu
In setting mode, on the
page
you can hide alarms from the main view by unchecking the Show on grid option.
The
button
reminds you that alarms are hidden by a dotted border around the bell.
The color code for dotted lines is the same as for non-hidden alarms.
The color indicates the highest value of hidden alarms.
The alarm settings are not saved when you exit the GUI.
2.3.1.8. Add or Delete Pages Back to up menu / main menu
You can have up to 10 pages with a specific widget organization.
To create a new page, click on
button.
The new page is automatically selected.
To delete a page, activate the page by clicking on the page number and
then on the
button.
2.3.1.9. Hide Widget label Back to up menu / main menu
On some widgets you can hide the label to save space on the screen and have a bigger display font.
When the Hide label when... box is checked, the label disappears automatically along with the menu bar.
Widget with visible label:
Same Widget with Hide label when... checked:
2.3.2. Preferred Units screen Back to up menu / main menu
In this screen, you choose which default units will be displayed on your widgets.
In 90% of cases the default values you choose here will correspond to your display habit.
For widgets on which the default units are not suitable,
you can change them individually on each widget in the Widget settings screen.
The application on widgets of the default units is done at the time of widget creation.
If your grid is already made up with widgets,
you can use the button
at the top right to apply the default units
to your already created widgets.
Use the
button
at the top right to reset the default units to their initial values.
2.3.3. Dark Mode Screen Back to up menu / main menu
In this screen, you can select how the dark mode will be activated:.
You have 3 choices available :
Display in dark mode:
2.3.4. Reset settings screen Back to up menu / main menu
In this screen, you can clear settings stored in local storage browser.
This settings are :
Select at least one checkbox and click on reset button.
![]()
2.3.5. Save settings screen Back to up menu / main menu
In this screen, you can save your settings on the server or in a json file.
Save on the server is only available on the Signal K server version > 1.27.0
The content of this screen follows the access level of the user who is logged in:
The
button save all your page layouts on the server.
The
button save your preferred units on the server.
If you are logged in with Admin access and you select save for global settings these preferred units will be loaded on new devices by default.
The
button make a backup of all your Instrumentpanel configuration.
2.3.6 Load settings screen Back to up menu / main menu
In this screen, you can load your previously saved settings from the server or from a json file.
Load from the server is only available on the Signal K server version > 1.27.0
As in the previous save screen, the screen content follows the access level of the user who is logged in:
After loading a layout, Instrumentpanel restarts with a warning screen at the top of the page
Click on
button to definitively validate your imported configuration.
This action will remove the warning message at the top of the page.
Make sure everything is working properly before enable
Click on
button if something doesn't work, you can reload your old configuration
Click on
to load the reset screen, it will allow you to erase parameters and return to a healthy configuration.
2.3.7 Widget border screen Back to up menu / main menu
In this screen, you can modify the widget's appearance (border thickness, margin, etc.).
Changes are automatically saved on the local device.
The reset button restores the initial settings.
3. Options Available on the Widgets Back to main menu
3.1. Widget in full screen Back to up menu / main menu
3.2. Changing Display Mode Back to up menu / main menu
Some widgets have the ability to change their display mode directly.
They are identified by a
icon in the top left corner.
Click on this icon to change the display mode.
New display mode is automatically saved.
3.3. Wind Widget Modes Back to up menu / main menu
The wind widget displays by default apparent wind.
This widget can also display True Wind over Ground and True Wind through Water,
if your Signal K server provides them. You can change the mode by clicking
on the
icon inside the widget.
If there is no data, an alert message is raised when you try to display these values.
You can have your server automatically calculate these values with the Derived Data plugin available in Signal K server AppStore:
Install the plugin and restart your Signal K server.
Then locate the pluging in the Server/Plugin Config:
Activate the plugin:
Enable the options for True Wind over Ground and True Wind through Water:
And then click on the
button to save and activate these options.
3.4. Digital Position Modes Back to up menu / main menu
The Digital Position Widget can display your position in different formats:
You can change the display format by clicking on the
icon.
The first click, displays the display format then the others clicks change the display format.
You have 5 seconds to repeat your clicks, after that the widget automatically displays its original label.
3.5. Display SourceID Back to up menu / main menu
To display the source Id of a widget's data stream, click on to the top right corner of widget.
To hide the source Id, just click in the displayed source Id field.
4. Full Screen mode & App mode Back to main menu
You can switch to full screen mode to make the URL bar disappear and save display space.
4.1 Full Screen mode Back to up menu / main menu
Click on the
buttons in the main bar to switch to full screen mode.
This feature is not available on all devices (not works on all IOS devices, see:App mode ...).
4.2 App mode Back to up menu / main menu
You can add to Home Screen InstrumentPanel on most mobile devices to use it as a mobile app.
4.2.1 On iPad or iPhone Back to up menu / main menu
4.2.2 On Android Back to up menu / main menu
5. Advanced options Back to main menu
For advanced users, you can manually specify the address and the protocol to connect to your Signal K server.
Be careful if you mix secure and unsecured protocols, your browser may refuse the connection.
To manually specify the address and the protocol of the Signal K server,
add the following query parameter ?signalkServer=wss://mysignalk.local:3443 to the url.
Use wss:// for secure websocket or ws:// for unsecure websocket.
6. Trouble? Back to main menu
InstrumentPanel stores some of its settings in the browser's local storage.
In case you have invalid stuff displayed, you can reset it
by adding the following query parameter ?reset=true to the url.
If you only want to reset a few parameters, use the GUI instead:
See Reset settings screen
If you see ERROR in unit retrieval on the upper of a widget, there is a problem to contact your Signal K server.
Be careful, the values displayed may be wrong.
Try to add the options to the URL described above.
Check your browser logs and ask for help on Discord: https://discord.gg/uuZrwz4dCS
Maybe you discovered a bug.
If you see NaN inside a widget, it means that the value returned by your Signal K server is incorrect and that InstrumentPanel cannot interpret it
7. Change Log Back to main menu
#277#273#272#271#270#269#268#267#265#264#258#259#250#249#248#244#242ffa0e2c#258#259#250#249#248#246#244#242#239#238#233#229#230#227#225#223#215#214#207#204#203#202#201#198#196#195#194#193#192#190#189#188#186#187#185#181#180#1794a217d2#178fe1c29144491a1b229e0b#169e0976e3a2b5f982333442d3201507f78f89c34e7bb3be0805a82e82e1d5b2861f514b9#132#133#131#130#129#1256aec0d7b89076b6cc2d1b#123#121#120#122#115#112#114#113#111#110e5755ad91967009686250#108#105#107#106#104#103#10255ea7a6#101d8092cf9e62312515de61#99#100#97#94#96#95#92#91#90e99072b15536e3#8975240472112cc8#88#86#87#83#824f68e9768507fa#80#77#74#76#81#78#75#79#7348544e257d49dd#706c2907e4b4839c7b4e61a418c06825f01bbf4c66130bf6a77fc9feb0#65c9520b7fa82da7ea9fb86#64ce8cb13#61319508d88199afa2cc526fda967a#46#57#56#52#50bef866d09e4326a5270841ec621239c19f6bf7c638#46#52#50bef866d09e4326295db36a527084aad1e3fb474874#29#28#23#18#16#15#12#11#10#7#52913cd73845c4fd8f0f50Change Log generated by auto-changelog.