How to dynamically update Bindows gauges

As you surely know by now, the Bindows gauges package is provided free of charge, without any warranty and without any commitment for support.

Still, we get a lot of support questions about updating certain aspects of the gauges dynamically. Therefore, in this post I will explain the general approach of dynamic updates to the gauges.

For truly dynamic updates you are supposed to use the full version of Bindows. Bindows Free Gauges have some limitations in this area (including not being documented) but if you know your way around Bindows you can still accomplish good things.

So in this example we are going to update the label of a gauge dynamically. Here is the gauge before any modification:

clock.png

The first step is to figure out which object is responsible for the effect that you want. It's pretty easy to read the xml file that describes the gauge and find the correct class.
If you are unsure, just change some properties, such as color, reload your page and see if you have targeted the correct class.
I am using "sample.html" and "g_clock_bindows.xml" as a base that comes standard with the Bindows Free Gauges package.

It was pretty easy to find the XML tag that is responsible for writing out the word "Bindows". That tag corresponds to a class in Bindows called BiGauge2Label. If you have access to Bindows, you can examine the source code and find there a non documented method called "setText". This method corresponds to the XML property called "text" which in turn spells out the word "Bindows".

Now we just need to add an "id" to this tag. Adding an id ensures that an object with the same name as the id is accessible on the object for the div that we create when we make the gauge itself.

adding_id.png

Now all we have to do is to use that object and call the setText method on it. Note that it doesn't matter where the tag is in the XML hierarchy. The JavaScript object will be directly accessible on the "clock" object.

dynamic_code.png

And the finished clock now toggles every second between the two labels and looks like this:

clock_changed.png

To learn more about how XML properties and tags relates to Bindows API documentation, check out this blog post.

Click here to run the application.