G Web Development Software

Showing results for 
Search instead for 
Did you mean: 

Gauge & Slider scale properties

Go to solution

Hi to everyone,


is there a property or a workaround to have the scale properies (max and min for example) of a Gauge or a Slider modified runtime? I need the user to have to ability to change the range in function of some user configuration and I am not able to figure out a way of doing it.





I was assuming this feature as basic (for example the graphs have it) and now I am stucked on the interface developement for an industrial controller. I am a long time Labview user and this is a big miss in my opinion on G Web.


Thank you in advance if someone has some advice or show me where I am wrong.


0 Kudos
Message 1 of 7

Really good question, only property of Gauge-Scale is Visible, sometimes RangeCustomDiagramTypeId (very odd name) pops up with errors, seem very buggy to me



0 Kudos
Message 2 of 7
Accepted by topic author Abbo93

This could be done with a JSLI, there are element attributes that control the range and manually changing them in the browser dev tools works as expected so it would take some javascript to handle modifying the attributes. Similar to what's done for other controls in this project from Milan: https://github.com/rajsite/webvi-experiments/tree/main/ControlExtensions


If I get some time this weekend I can take a whack at implementing the scale range similar to Milan's ControlExtensions.

Message 3 of 7

Thank you, I've found the attributes of my gauges and tried to manually mody them: it works!


Anyway I'm a total noob with html/JS/CSS so I don't think I am really able to write down a custom piece of code that dynamically changes these attirbutes. Since this is a quite common functionality I hope NI will implement this dynamic range adjustment in some future release.

0 Kudos
Message 4 of 7

Chatted with Milan, there'll be a library you can download and use in your project soon.

0 Kudos
Message 5 of 7
Accepted by topic author Abbo93

Hi Abbo93,


I updated the example that Derrick mentioned and made it available on the Control Extensions for WebVI example code page. The example includes a VI that can be used to configure the minimum and maximum of some numeric controls like the gauge and slider. Controls like the Numeric Text that have property nodes for setting maximum and minimum should use those instead.


Be aware that if you use examples that manipulate NI controls directly via JavaScript you need to test it thoroughly and plan to test them manually when upgrading G Web Development Software versions. NI could change the underlying controls or their behavior and JSLI-based approaches may need to be updated or replaced in the future.


Hopefully the example provides a good starting point!

Message 6 of 7

Thank you! Great!!!

0 Kudos
Message 7 of 7