# Editable graph any suggestions please

**URL:** <https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936>\
**Category:** General\
**Tags:** node-red-dashboard\
**Created:** [29 October 2021 10:57 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936 "2021-10-29T10:57:52Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![vikingsraven](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vikingsraven/32/49243_2.png) [@vikingsraven](https://discourse.nodered.org/u/vikingsraven)\
**Post date:** [29 October 2021 10:57 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/1 "2021-10-29T10:57:53Z")

</div>

Hi all,  
im trying to build a multi channel servo controller ill be using a PI 3B + with the i2c servo board ( 16 channels per board), what i would like to do is:

1. Set a time period
2. Realtime record servo positions ( analog controllers!) record to influxdb
3. edit a graph to adjust the position of individual servos
4. save then playback  
its the graph thing im struggling on how to deal with. is the a node that might exist?  
I used to do this with midi years ago and used some audio software to adjust the midi values.  
Basically an animatronics copycat system.

any suggestions ( polite ones please!)  
thanks

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [29 October 2021 15:50 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/2 "2021-10-29T15:50:08Z")

</div>

This answer seems to have a workable solution that you may be able to adapt:

> <https://stackoverflow.com/questions/43757979/chart-js-drag-points-on-linear-chart/59110888#59110888>

Running the code snippet lets you drag chart points .

But a quick search showed that several of the chart libraries have drag events that you can tie into.

---

<div class="post-metadata">

**Author:** ![Christian-Me](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/christian-me/32/10774_2.png) [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)\
**Post date:** [29 October 2021 21:55 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/3 "2021-10-29T21:55:40Z")

</div>

Something like this? Only as an inspiration.  
 ![MNIlKxiVHD](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/0/c0f90df9a18146ca8004f7bc88de8e049368289e.gif)

I did years ago with the chart node to setup my room thermostats. The flow is old and filled with a ton of legacy code from my early Node-RED years. Certainly not a task Node-Red is good for. If I would do it again I still would use the dashboard but with one custom ui node.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/2/f2815f979be4687cf11e01fd2d3c646c375e9b22.png)  
you can setup rooms and periods  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/6/4/64ca6109d47d519e62e9fc242358e3bb62ae9245.png)  
Every room has a phone friendly group with the actual temperature curve superimposed  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/2/d2cbc024b627c2780e475fce6c9fd54bbae8a9ae.png)  
To be honest ... I don't use it anymore. Settings are so good that it works in the background for years now. So a custom node is not on my agenda.

---

<div class="post-metadata">

**Author:** ![Christian-Me](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/christian-me/32/10774_2.png) [@Christian-Me](https://discourse.nodered.org/u/Christian-Me)\
**Post date:** [29 October 2021 22:03 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/4 "2021-10-29T22:03:52Z")

</div>

Thank you for sharing.

Makes me again think about building something similar as a widget - but no. If I don't really need it I should not invest time in it.

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [30 October 2021 07:18 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/5 "2021-10-30T07:18:15Z")

</div>

Must be honest that I see potential in the proposal from @vikingsraven, because there are a lot of use cases.

Would be nice if somebody could implement a UI widget for this. I'm too busy with other nodes at the moment. The link from @TotallyInformation is a great starting point, but of course extra features would be nice: e.g. have a selection rectangle to (re)move multiple datapoints simultaneously, and so on...

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [30 October 2021 07:34 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/6 "2021-10-30T07:34:42Z")

</div>

> [@TotallyInformation](#):
>
> This answer seems to have a workable solution that you may be able to adapt

The [chartjs-plugin-dragdatajs](https://github.com/chrispahm/chartjs-plugin-dragData#chartjs-plugin-dragdatajs) (mentioned in that Stackoverflow discussion), seems also to be pretty nice...

---

<div class="post-metadata">

**Author:** ![vikingsraven](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/vikingsraven/32/49243_2.png) [@vikingsraven](https://discourse.nodered.org/u/vikingsraven)\
**Post date:** [30 October 2021 08:37 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/7 "2021-10-30T08:37:41Z")

</div>

Thanks for the info all.  
Ill have a play and see what it does, not to great with javascript so it will be a good thing to look at .  
thanks again

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [30 October 2021 10:38 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/8 "2021-10-30T10:38:02Z")

</div>

> [@vikingsraven](#):
>
> not to great with javascript

Every time you are stuck, don't hesitate to ask your question here. We will assist you. Always nice to see folks that are interested to start building something like this...  
Good luck!  
Bart

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [13 November 2021 10:38 UTC](https://discourse.nodered.org/t/editable-graph-any-suggestions-please/52936/9 "2021-11-13T10:38:17Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.