The Dashboard displays gauges, graphs and switches, all of which are updated in real-time, and all of which you get to choose. You are given a blank canvas and you get to decide what goes where, how big things are, what scales to use. It is as customisable as possible. Graphs are available starting with HQ 0.22.

Here’s an example of a dashboard layout that I like, taken from my development environment.

There are two things to know about the dashboard. First, the dashboard canvas is divided up into four regions, and second, you place objects (gauges, graphs or switches) into regions.

This image highlights the four regions: a top line running the entire width of the page, a left margin running down the left hand side, a right margin running down the right, and the central panel that sits between the left and right margins.

There are no restrictions on where objects go. You can mix gauges, graphs and switches if you like. If you don’t put any objects in a region then that region wont be rendered on the page, that is, it won’t take up any space.

Some simple rules accompany each region. The top line will only stack objects horizontally, the left and right margins only stack objects vertically, and the central panel is a vertical stack of horizontal rows, each row centered within the panel.

You might notice there’s a bit of space between the switches in the top line. This is another property of the top line, adding space to separate things. I use this to visually separate objects into groups. Here I’ve separated the two objects relating to a Consumer controller (my Lights) from the relays of my three Battery controllers. In a similar way, the left and right margins allow you to add vertical space to visually separate objects. The central panel does not provide a similar capability.

The first time you access the SharksHead web site the dashboard will be populated with a default set of objects to get you going. If you haven’t enrolled any modules the dashboard will be pretty empty. As a suggestion, enrol all your modules before setting up your dashboard.

So how do you do all this and what options do you get. Hit the Edit link at the bottom left of the page. This will show a fifth region, below the standard four, containing all the objects available to be moved into the standard regions. Overlaid over every object will be a drop-down menu. At the top of the page you’ll have Done and Clear links.

The drop-down menu is broken into several sections, each of which is dependent on the region and the object.

The top of the menu allows you to move the object between the regions or to remove the object, which means to put it back into the available objects pool.

The region specific options include moving an object to the left or right in the top line, up or down in the margins, and up, down, left or right in the central panel.

The object itself also has an influence on the drop-down menu options. Gauges, for example, can be displayed in five different sizes and two different visual styles.

And it doesn’t stop there. The type of value the gauge displays can change the menu options. For example, all voltage gauges can show a scale from 9-15V to 12-15V. Likewise, all current and power gauges have a range of scales to choose from, including logarithmic scales (which I love.)

All the while you are in edit mode every object on screen updates in real-time and all switches are fully functional.

Hit the Done link when you’re finished and all the drop-down menus disappear, as do the available objects at the bottom of the window.

All gauges show the latest, current (time, not electrical) values from the various modules. However, if we don’t receive an updated value from a module for a couple of minutes, we deem the latest value to be stale. Rather than display old, stale data the gauge will, instead, remove the needle, and the value at the bottom, from the gauge. Once an updated value is received the latest value will change from stale to current, and the needle and value will be restored on the gauge. All this happens automatically and in real-time.

Stale data handling not only applies to gauges on the dashboard, it applies to every SharksHead page which shows real-time values, including the status panel.

The configuration for the dashboard is stored in your browser’s cookie, so if you use multiple browsers or devices you’ll need to set up the dashboard on each. This allows you to tailor the dashboard to any display size.