# \[Announce\] node-red-contrib-ui-state-trail \[Features\]

**URL:** <https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539>\
**Category:** Share Your Nodes\
**Created:** [18 January 2020 16:49 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539 "2020-01-18T16:49:05Z")\
**Posts on this page:** 20\
**Page:** 3

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [3 May 2020 19:34 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/41 "2020-05-03T19:34:01Z")

</div>

Multi-line option has been asked before. There is a long list of things why it is not done so far. First of them will be too many restrictions to preserve at least some kind of performance and not to kill the browser. And those restrictions make current solution barely usable.  
It must be something different, totally new widget.  
Do I have plans to implement such? Not yet.

---

<div class="post-metadata">

**Author:** ![dceejay](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/dceejay/32/38_2.png) [@dceejay](https://discourse.nodered.org/u/dceejay)\
**Post date:** [3 May 2020 19:34 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/42 "2020-05-03T19:34:04Z")

</div>

As it can be one unit high can’t you just add multiple widgets ?

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [30 October 2021 07:50 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/43 "2021-10-30T07:50:19Z")

</div>

Hi, I tried browsing through all the communication for this widget, could not find. so apologies if this is a repeat.  
is it possible to increase the thickness of the line ? i tried increasing widget size vertically, but no effect.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [30 October 2021 08:33 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/44 "2021-10-30T08:33:23Z")

</div>

There will be one feature release in near future anyway. Let's see if we can do something about it 🙂

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [31 October 2021 19:33 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/45 "2021-10-31T19:33:40Z")

</div>

Version 0.4.0 published.

- widget height can be now more than 2 units
- alongside the `msg.payload` you can send `msg.reference` where you can hold any kind of additional data of the state.
- some smaller bugs fixed

Enjoy 🙂

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [1 November 2021 11:50 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/46 "2021-11-01T11:50:26Z")

</div>

Thank you so much, feels like _my_ request was approved.  
I updated immediately, but now i am not seeing the time ticks... what did i do wrong ?  
i increased the size to 50x 4 from 50x1

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [1 November 2021 11:54 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/47 "2021-11-01T11:54:06Z")

</div>

Make an image and show here.  
Also - add info about the browser you are using.

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [1 November 2021 12:15 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/48 "2021-11-01T12:15:20Z")

</div>

Sorry, here you go.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/a/6a51213b8c4dc8b213f4dfdeaebe8d6115a75b15.png)

in one Computer- Google Chrome Browser

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/5/05f6d7a98e99a7d10ccd39763360294513633338.png)

in another Edge- ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/2/7/27e65b904ce2f7601cdcf0661e3a501f00a93745.png)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [1 November 2021 12:19 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/49 "2021-11-01T12:19:03Z")

</div>

Do you use any CSS overrides?  
How the dashboard size settings are configured?

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [1 November 2021 12:23 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/50 "2021-11-01T12:23:19Z")

</div>

I am so sorry, i wont understand anything in your first line. if you mean i have any dashboard widget template node etc .. no.  
about dashboard, the site settings are as follows

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/3/d3734d3985e918fe5df0aa8ea862db65b8bbb662.png)

and it was working fine till I updated the node. (i was able to see HH:mm under the timeline

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [1 November 2021 12:24 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/51 "2021-11-01T12:24:18Z")

</div>

Thank you. Issue identified. Expect an update with fix even today or tomorrow.

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [1 November 2021 14:35 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/52 "2021-11-01T14:35:59Z")

</div>

If you see my screenshot, i have written a function node which calculates the difference of time in minutes between the state changes and displays in the header using a ui\_text node, is it possible to get it out of the output of the node easily somehow ?

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [1 November 2021 15:19 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/53 "2021-11-01T15:19:42Z")

</div>

Version 0.4.1 available. Fixed misaligned tick-marks.

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [1 November 2021 15:27 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/54 "2021-11-01T15:27:07Z")

</div>

> [@smanjunath211](#):
>
> the difference of time in minutes between the state changes

This is a bit unclear. What are the values to calculate time-span? You have 2 timestamps but does the widget have them also? Are they oldest and youngest timestamp in widget?

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [2 November 2021 05:19 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/55 "2021-11-02T05:19:49Z")

</div>

Ver 0.4.1 did the trick Huge Thanks!

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/b/3b0843c47eb1698f74b255c11578e96d19ae03ed.png)  
Now i am able to see the time ticks below the bar.

the time span i was referring to when i said _(the difference of time in minutes between the state changes)_ , which now i calculate by subtracting the two outputs from the node that is generated after i click part of the trail was unnecessary, your node is already giving the duration in milliseconds. (Bummer !) 🤦‍♂️  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/8/9805de4200c0afce75bbd81a3b2000b607b4dbc2.png)

---

<div class="post-metadata">

**Author:** ![WeeSeong](https://avatars.discourse-cdn.com/v4/letter/w/e19b73/32.png) [@WeeSeong](https://discourse.nodered.org/u/WeeSeong)\
**Post date:** [18 March 2022 04:00 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/57 "2022-03-18T04:00:55Z")

</div>

Hi, sorry for continuing this thread, may I know is there a reason why one of the state trail has sharper line than the other? What I did was copy and paste the same node and give them a different name.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/1/e1d53034948e760e2423c348652135194bb1c20a.png)

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [18 March 2022 04:10 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/58 "2022-03-18T04:10:43Z")

</div>

I have no clue what can produce this.  
Try to remove and recreate the widget, clean browser cache in between.

To try to reproduce, it takes to have same or at least most similar setup and conditions as yours. And everything counts, starting from dashboard and widget setup to the browser and OS versions ... A long list of stuff.

---

<div class="post-metadata">

**Author:** ![WeeSeong](https://avatars.discourse-cdn.com/v4/letter/w/e19b73/32.png) [@WeeSeong](https://discourse.nodered.org/u/WeeSeong)\
**Post date:** [25 March 2022 01:04 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/59 "2022-03-25T01:04:39Z")

</div>

From what I've noticed, the line starts to blur when it changes state to 5 times, any less than that amount will have the clear line.

EDIT:

- added picture to show the difference  
 ![Untitled](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/6/760d6ef3edb7bcff5af885e02cfce69a45466d9e.png)

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [26 March 2022 04:28 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/60 "2022-03-26T04:28:47Z")

</div>

I have similar issue. what is required to be done to get sharper lines. i am sure earlier i was getting sharper lines at intersection, but cant reproduce. you can see my earlier post [[Announce] node-red-contrib-ui-state-trail [Features] - #48 by smanjunath211](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/48). which has so much better

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/e/7eaa7e35ccfa9f5e040959deae9388112a05cd32.png)

---

<div class="post-metadata">

**Author:** ![smanjunath211](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/smanjunath211/32/95742_2.png) [@smanjunath211](https://discourse.nodered.org/u/smanjunath211)\
**Post date:** [28 March 2022 08:44 UTC](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539/61 "2022-03-28T08:44:31Z")

</div>

Have further studied the issue.

the same flow which is running in one computer, if dashboard is viewed in two different computers in the same network, one is having blurred line, the other is sharp.

also, in the blurred view, some lines (very small increment) are missing (invisible, may be within the blur), but can be 'clicked' that is they give output.

> [@WeeSeong](#):
>
> From what I've noticed, the line starts to blur when it changes state to 5 times, any less than that amount will have the clear line.

and yes, reducing the number of state changes to less than 5 , the blurred display also gets sharp.

[Previous page](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539.md?page=2)

[Next page](https://discourse.nodered.org/t/announce-node-red-contrib-ui-state-trail-features/20539.md?page=4)