Control Dashboard Graphics & Gauges Bar Graphs

General
1

Hi All,

I’m looking for some controls for dashboard graphics/widgets for use as a front-end display to an industrial controller. See images for examples. I’m okay with third party products. Would like a consistent library of indicators, and perhaps switches and controls as well.

Any ideas or suggestions?

image
image412×892 39.7 KB

2

Einhugur has a gauge control, but I think it’s just the one.

1 Like
3

Speaking as a Data Visualization coach, I’m going to suggest something a little radical: consider making bullet graphs instead of gauges. They have a lower error rate for people who are reading them and making decisions using them. They also take up less space on your dashboard. And I’m going to suggest that they’re easier to program.

1 Like
4

Take a look at MBS Chart Director Control.

2 Likes
5

Try “Cool Loading Wheel Control” from Xojo + Alfred

Screenshot 2025-12-13 at 06.47.55
Screenshot 2025-12-13 at 06.47.551104×1112 33.5 KB

1 Like
6

Maybe take a look at : GitHub - Valdemar-VDSC/CircularGauge

2 Likes
7

Looks like some great solutions, thank you all for your suggestions.

8

Hello,
Do you have a screen shot of what you are writing about?
Tim

9

image
image1414×754 15.9 KB

I’ve seen lots of implementations. You’re basically looking at a bar that has different colored or shaded segments (that would be equivalent to the colored sections of your gauge). The vertical bar is your target. The interior shaded bar is the current value.
It’s very compact and excellent for dashboards. Whereas gauges take up lots of room, so you are limited with how many you can put on a screen. The only negative about bullet charts is basic unfamiliarity that people have with it.

(When I teach my data visualization class, I describe bullet charts in my section on charts that you should be using more frequently)

10

i would use a sub classed canvas with computed properties to call refresh that raise the paint event.

https://documentation.xojo.com/api/graphics/graphics.html#graphics
https://documentation.xojo.com/api/graphics/index.html
https://documentation.xojo.com/api/graphics/object2d.html
https://documentation.xojo.com/api/graphics/picture.html#picture-applymask

11

I have to be honest, even as a technical person, I find that chart a bit confusing with all the different colors.

Is the current value the length of the blue rectangle? What do the dark grey rectangle and light grey rectangle represent? Perhaps ranges? The vertical seems clear, but not sure what the others are.

Thanks for taking the time to illustrate and post this.

image
image1473×785 36.9 KB

12

No problem.

I’m used to it because I’ve used it for several years. The solid colors are optional - they match the colors that you would see on your grid. Lots of DV people used muted colors and reserve the bright colors for when we really need to draw attention to something. But you can imagine the dark grey on the left as red, the light grey in the middle as yellow, and the white on the right as green, just like you would see a gauge with three colors. The black bar indicates your target. And the blue bar in the middle shows your current value.

1 Like