From Friday, April 19th (11:00 PM CDT) through Saturday, April 20th (2:00 PM CDT), 2024, ni.com will undergo system upgrades that may result in temporary service interruption.

We appreciate your patience as we improve our online experience.

G Web Development Software

cancel
Showing results for 
Search instead for 
Did you mean: 

Gauge & Slider scale properties

Solved!
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.

 

Abbo93_0-1666948732576.png 

Abbo93_1-1666948787764.png

  

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.

Marco.

0 Kudos
Message 1 of 7
(1,912 Views)

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

yura_beno_0-1667473873534.png

yura_beno_1-1667474177455.png

0 Kudos
Message 2 of 7
(1,852 Views)
Solution
Accepted by 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
(1,842 Views)

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
(1,803 Views)

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

0 Kudos
Message 5 of 7
(1,785 Views)
Solution
Accepted by 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!


Milan
Message 6 of 7
(1,770 Views)

Thank you! Great!!!

0 Kudos
Message 7 of 7
(1,708 Views)