Hello everyone, has anyone already found a solution for a StateTrail node in DB2.0?

Kinda, by using echarts in a template node: How to- submit html form using template table - #6 by Steve-Mcl Here is a different demo where echarts is used in a template node : How to configure Echarts in Dashboard 2? - #4 by Steve-Mcl If you combine the code from the first pen to the 2nd flow you …

New Development. [image] NEW: Timeline/state-trail Web Component Share Your Projects Hi all, as indicated in Statetrail chart in uibuilder - #16 by TotallyInformation (and a few other threads), I've started work on a new web component. Here is what it looks like so far al…

You could also use a markdown node with a mermaid gantt chart . [image] produces: [image]

Excellent ! Configuration was really easy and intuitive. Is it possible to have click event ? Yes the docs say, need to find out how.. [image] [{"id":"247b5d3411247210","type":"ui-markdown","z":"7c54d6845755357a","group":"a870a89a79a6be1f","name":"","order":1,"width":"24","height":"1","content"…

[image] smanjunath211: @TotallyInformation Yup, Markdown & Mermaid also well supported by UIBUILDER. :grin: The front-end uibuilder library recognises the use of the Markdown-IT library and also allows the inclusion of Markdown-IT extensions including Mermaid.

Is there a way to feed in dynamic data ..e.g. It shows the ON/OFF states over 24h ? .. shifting automatically :wink:

Yes, you can use {{msg.payload}} for example. See documentation .

If only I was able to get the on click event working...

Click events require javascript, you can http-in/out nodes where you include the mermaid library and write the javascript to get the click behaviour, or use a normal template node or use uibuilder. eg in a dashboard template node you can do something like (it probably needs vue bindings somewhere): …

Yeah, I saw the documentation ... but I'm struggling to get the format right :frowning: Does anybody have an example with feeding the msg.payload object ?

Node-RED

Node-RED Forum

StateTrail-Node for Dashboard 2.0

Dashboard

TotallyInformation 17 December 2024 17:59 18

Topic		Replies	Views
UIBUILDER: Using MermaidJS FAQs uibuilder	13	244	16 January 2025
Ui-template -> using V1 state timeline Dashboard dashboard-2 , ui-template	2	129	18 October 2024
[Announce] node-red-contrib-ui-state-trail [Features] Share Your Nodes	74	5145	29 March 2022
Statetrail chart in uibuilder General uibuilder , statetrail	16	245	13 March 2025
Show timeline chart in dashboard Dashboard	5	3296	1 November 2019

Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

StateTrail-Node for Dashboard 2.0

Related topics