# Display Thermometer Widget Problem

**URL:** <https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979>\
**Category:** General Discussion\
**Created:** [August 2, 2013, 10:30pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979 "2013-08-02T22:30:40Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![quinadler.hgst](https://avatars.discourse-cdn.com/v4/letter/q/c6cbf5/32.png) [@quinadler.hgst](https://forum.inductiveautomation.com/u/quinadler.hgst)\
**Post date:** [August 2, 2013, 10:30pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/1 "2013-08-02T22:30:40Z")

</div>

I am attempting to create a simple display image that has all the functionality of the thermometer (changes colors when the data gets to a certain value, etc) but I only want the image to be a circle, excluding the stem of the thermometer widget.

Anyone know of any tricks I could use to do this?

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [August 7, 2013, 12:00pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/2 "2013-08-07T12:00:05Z")

</div>

Hi! Welcome to the forums!

Ok, just so I’m straight on this, you want a circle that changes color via a value, right?

If so, then this example window may be of help. This actually has two circles. One uses styles to change color from green to yellow to red to flashing red, the other uses a gradual change from green to yellow to red. I wrote this up to show my guys here that there are different ways to do the same task. Me, I like to make things visually pop. A little more effort up front, but usually worth the end result.

Also, to help you get familiar with what I did, please read up on the following in the manual:  
[ul][li]Style Customizer[/li]  
[li]Color[/li]  
[li]toColor[/li][/ul]

Hope this helps!

EDIT: Removed non-existant file link. Reattached below.

---

<div class="post-metadata">

**Author:** ![quinadler.hgst](https://avatars.discourse-cdn.com/v4/letter/q/c6cbf5/32.png) [@quinadler.hgst](https://forum.inductiveautomation.com/u/quinadler.hgst)\
**Post date:** [August 14, 2013, 5:08pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/3 "2013-08-14T17:08:03Z")

</div>

Thanks for the reply, Jordan. What you’re saying makes sense, but when I attempted to download your attachment, it was nowhere to be found. Said that the attachment had been deleted, or something. Can you re-attach it, please? I really appreciate the help.

–Quin

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [August 14, 2013, 5:25pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/4 "2013-08-14T17:25:36Z")

</div>

Man, that stinks! Here ya go…

---

<div class="post-metadata">

**Author:** ![quinadler.hgst](https://avatars.discourse-cdn.com/v4/letter/q/c6cbf5/32.png) [@quinadler.hgst](https://forum.inductiveautomation.com/u/quinadler.hgst)\
**Post date:** [August 14, 2013, 6:12pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/5 "2013-08-14T18:12:22Z")

</div>

Oh man that’s awesome! Thanks so much, that’s exactly what I was looking for.

One quick followup (mostly because I’m a newbie): if I want the number that is correlated to the color to appear inside the circle as well, how would I accomplish that?

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [August 14, 2013, 7:12pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/6 "2013-08-14T19:12:43Z")

</div>

Put a label object over the circle (or wherever, really) and bind the text property to the value.

---

<div class="post-metadata">

**Author:** ![nathan](https://avatars.discourse-cdn.com/v4/letter/n/c5a1d2/32.png) [@nathan](https://forum.inductiveautomation.com/u/nathan)\
**Post date:** [August 14, 2013, 7:21pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/7 "2013-08-14T19:21:07Z")

</div>

Jordan - awesome example. I hope you don’t mind that I did the following:

1. Added a few labels on the circles.  
1a. Bound the text value of those to the slider value.
2. Added the LCD indicator and bound the value.
3. Added the checkbox for “defer updates”  
3a. Bound the sliders “defer updates” property to the boolean value of the checkbox. Try dragging the slider without releasing the mouse in both cases.

These [old FactoryPMI videos](http://inductiveautomation.com/support/videos/4) illustrate all that and more with binding and expressions.

---

<div class="post-metadata">

**Author:** ![quinadler.hgst](https://avatars.discourse-cdn.com/v4/letter/q/c6cbf5/32.png) [@quinadler.hgst](https://forum.inductiveautomation.com/u/quinadler.hgst)\
**Post date:** [August 14, 2013, 7:58pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/8 "2013-08-14T19:58:09Z")

</div>

Thanks for the help! That’s exactly what I was looking for. Much appreash.

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [August 14, 2013, 8:22pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/9 "2013-08-14T20:22:07Z")

</div>

> [@nathan](#):
>
> Jordan - awesome example. I hope you don't mind that I did the following:

You did WHAT?!? Ok, just kidding. My blessing comes in the sharing. ![:thumb_right:](https://us1.discourse-cdn.com/inductiveautomation/original/1X/2026e28c0c425034352c1b75807edf956adc75f4.gif ":thumb\_right:")

I thought I had the defer updates unchecked. Like I said, I use this project to show examples to my guys here. must've re-saved with it checked. Ah well...

Making the analog color portion was a treat and a challenge to do. Banged my head for a half-hour because my math wouldn't come out right. 😆

---

<div class="post-metadata">

**Author:** ![mdentoom](https://avatars.discourse-cdn.com/v4/letter/m/c77e96/32.png) [@mdentoom](https://forum.inductiveautomation.com/u/mdentoom)\
**Post date:** [August 20, 2019, 7:32pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/10 "2019-08-20T19:32:43Z")

</div>

Hey Jordan, Would like the same thing as the original post but don’t see any downloads in this conversation. Just need a square with all the same funtions as the thermometer. Do you have any examples I could use?

---

<div class="post-metadata">

**Author:** ![mdentoom](https://avatars.discourse-cdn.com/v4/letter/m/c77e96/32.png) [@mdentoom](https://forum.inductiveautomation.com/u/mdentoom)\
**Post date:** [August 20, 2019, 7:35pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/11 "2019-08-20T19:35:22Z")

</div>

Would be awesome to able to change the thermometer graphic to what ever we needed.

---

<div class="post-metadata">

**Author:** ![JordanCClark](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jordancclark/32/83362_2.png) [@JordanCClark](https://forum.inductiveautomation.com/u/JordanCClark)\
**Post date:** [August 20, 2019, 9:40pm UTC](https://forum.inductiveautomation.com/t/display-thermometer-widget-problem/6979/12 "2019-08-20T21:40:06Z")

</div>

Here you go.

[Analog Color\_2019-08-20\_1736.proj](https://us1.discourse-cdn.com/inductiveautomation/original/2X/2/26da0be72e21671e77828d41beb4b0b1d8f3681f.proj) (15.6 KB)
