# A Linear Gauge For Node-Red

**URL:** <https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001>\
**Category:** Share Your Nodes\
**Created:** [20 December 2018 20:03 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001 "2018-12-20T20:03:35Z")\
**Posts on this page:** 20\
**Page:** 2

<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:** [24 December 2018 13:10 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/21 "2018-12-24T13:10:39Z")

</div>

@seth350, lots of issues. That is your disadvantage now, when doing pioneer work ...

> [@seth350](#):
>
> The problem did not resolve itself until I upgraded to dashboard v2.13. I was on v2.9.8.

Ah yes, the widget API is only recently added to [dashboard](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196) version **2.10.0**. Would be good if you could add that to the readme page, in the installation section.

> [@seth350](#):
>
> How to individualize each widget?

Well seems you have already analysed it very well.  
Seems indeed that you need to specify (in your raw html section in your js file) a dynamic id, similar to the [gauge](https://github.com/node-red/node-red-dashboard/blob/80c6e45558700148db02978405750689bf9397ad/src/components/ui-gauge/ui-gauge.html) node:

```auto
<div id="gauge_{{$id}}" ...

```

Not sure at the moment where the $id is coming from, and if you have to specifiy it somewhere

**[EXTRA]** Another thing that might be usefull is theming support. When you look e.g. at the [gauge-node](https://github.com/node-red/node-red-dashboard/blob/master/nodes/ui_gauge.js#L23), they get the settings of the current theme and display the gauge in those colors (if available):

```auto
        var theme = ui.getTheme();
        if (theme === undefined) {
            theme = {"group-textColor":{value:"#000"}};
            theme["widget-textColor"] = {value:"#000"};
            theme["widget-backgroundColor"] = {value:'#1784be'};
        }

        var gageoptions = {};
        gageoptions.lineWidth = {'theme-dark':0.75};
        gageoptions.pointerOptions = {'theme-dark':{color:'#8e8e93'}, 'theme-custom':theme["group-textColor"].value};
        gageoptions.backgroundColor = {'theme-dark':'#515151', 'theme-custom':theme["widget-textColor"].value };
        gageoptions.compassColor = {'theme-dark':'#0b8489', 'theme-light':'#1784be', 'theme-custom':theme["widget-backgroundColor"].value};

```

@dceejay : _I'm not sure whether every widget developer needs to add this kind of code, or whether this will/can be applied automatically for all widget nodes by the dashboard???_

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [24 December 2018 13:32 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/22 "2018-12-24T13:32:32Z")

</div>

> [@BartButenaers](#):
>
> > v2.9.8.
> 
> Ah yes, the widget API is only recently added to [dashboard](https://discourse.nodered.org/t/announce-dashboard-version-2-10-0/4196) version **2.10.0**.

Isn't it possible to specify the minimum dashboard version as a requirement in the package.json?

---

<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:** [24 December 2018 13:37 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/23 "2018-12-24T13:37:40Z")

</div>

Good question. Normally you add a dependency to your contribution, which downloads automatically the library you need **underneath**. However in this case, the dashboard is calling the widget contribution (not the other way around) as a **parent**. The widget is being loaded by an existing application. So I don't think it is possible, but I can be completely mistaken ...

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [24 December 2018 13:47 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/24 "2018-12-24T13:47:43Z")

</div>

It also seems that there are different APIs to use.

The gauge node uses this when creating the node:  
`var ui = require('../ui')(RED);`  
`var done = ui.add({`

The linear gauge uses:  
`ui = RED.require("node-red-dashboard")(RED);`  
`var done = ui.addWidget({`

Not sure if there is any difference?

The linear gauge also does not show up under the group in the dashboard side bar.

---

<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:** [24 December 2018 14:29 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/25 "2018-12-24T14:29:13Z")

</div>

That is because the ui\_gauge is built in so can get to the RED object using a relative path - whereas adding external nodes need to use the RED.require call to be given the instance instead.

Re theme - well you can certainly use the getTheme() call to get the current theme - hopefully it should always return something rather than you have to default everything... but yes - once you have that you can use the various parts to colour your widget appropriately.

Re {{$id}} - that should come from the individual scope of each widget I think... (haven't looked for a while - hopefully may get some time over the holidays...)

and yes @seth350 - you are on (or just over) the bleeding edge. One of our tasks for next year is to set up a ui nodes project to hold some of the basic examples and docs - so any thoughts / docs / notes you can come up with would be appreciated by those who follow.

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [24 December 2018 16:28 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/26 "2018-12-24T16:28:51Z")

</div>

Thank you dceejay.  
I will document what I can in case it’s of any help.

I had found the {{$id}} last night but did not get to dig into it. I feel like it is also tied into the “order” attribute as well.  
The built in widgets increment their order as they are added to the dashboard, but are instantiated as “0” within the node. Something else is changing the attribute.

It may be just as easy to duplicate the ui\_template node and use it as the boiler plate when building our own widgets. It seems to have all the functionality we would need built in, except for the ability to configure different options in the node-red admin. That should just be changing the ui\_template nodes .html file.

I may do some testing with that sometime after the holidays.

In the mean time, I hope everyone has a wonderful holiday and thank you for all your help. I really appreciate it.

Merry Christmas!!

---

<div class="post-metadata">

**Author:** ![Paul-Reed](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/paul-reed/32/66906_2.png) [@Paul-Reed](https://discourse.nodered.org/u/Paul-Reed)\
**Post date:** [24 December 2018 17:13 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/27 "2018-12-24T17:13:49Z")

</div>

> [@BartButenaers](#):
>
> So I don't think it is possible

I was thinking that the dashboard version could be added under npm "peerDependencies".

```auto
"peerDependencies": {
    "node-red-dashboard": ">=2.10"
    }

```

...but maybe I misread the docs - [https://docs.npmjs.com/files/package.json](https://docs.npmjs.com/files/package.json)

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [27 December 2018 06:12 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/28 "2018-12-27T06:12:25Z")

</div>

I hope everyone had a pleasant holiday.

I did manage to find some clues to how to individualize each ui widget.

Digging around the source code I found this nugget.

```auto
scope.$watch('me.item.gtype', function() {
                        if (unregtype) { unregtype(); }
                        // Wave type gauge
                        if (scope.$eval('me.item.gtype') === 'wave') {
                            document.getElementById("gauge_"+scope.$eval('$id')).innerHTML = '<svg id="gauge'+scope.$eval("$id")+'" style="width:100%; height:100%;"></svg>';

```

> <https://github.com/node-red/node-red-dashboard/blob/master/src/components/ui-gauge/ui-gauge.js>

So it seems that `scope.$eval('$id')` is what determines or finds the individual widget.  
However, I have yet been able to find where the functions are for `scope`. Seems I have looked through every `.js` file under node-red-dashboard's git.  
I can only find where `scope` is being passed as a parameter, and I do believe that `scope` is referring to the current object/widget being updated/created.

### Some moments later...

Some research tells me that `scope` is actually part of angular and `scope.$eval` is a function within angular to allow the user to pass an expression.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/1/102bcdd44f074ee0760513954606020beb0e7918.png)

Armed with this knowledge, I think I see now how you guys are interacting with the widgets on an individual basis.  
Correct me if I am wrong please, for I am just a simple dabbler-in-Java-Query-Script...  
Each time a widget is called to update, a scope is referenced for that update. The particular update instance has a unique ID. `$scope.$id`  
You then use that `$id` and set the widget's id in the html. I.E., `<div id=widget_'+$id>`.  
Once that is done, you can then reference that particular widget using the `widget_$id` and apply CSS changes and other changes to it's children using jQuery.

I witnessed this when I added a standard gauge widget to the dashboard.  
The `<div id` for the gauge started out as `<div id='gauge_206'>` and as the breakpoints hit, the id would increment by some margin. Right now it is at `<div id='gauge_496'>`

Hopefully I conveyed this so that it makes sense.

---

<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:** [27 December 2018 09:01 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/29 "2018-12-27T09:01:42Z")

</div>

Hey @set350, welcome back. Hope you had a nice Christmas.  
I saw you had published your widget on npm, so I thought you had already figured it al out 😉

> [@seth350](#):
>
> Correct me if I am wrong please, for I am just a simple dabbler-in-Java-Query-Script...

I only use AngularJS when I have to do something in the dashboard, so don't know much about it.

- The dashboard is build in AngularJs (wich is build in Javascript unlike Angular which is build in Typescript).

- The AngularJs **scope** is a JavaScript object which contains both properties and methods, and is used for (2 way) data binding between the (html) view and the Angular controller.

- There can be multiple scope objects in an AngularJs application. When AngularJs scans the DOM tree and finds **ng-app** , the root scope object ( **$rootScope** ) will be created. And every time an **ng-controller** is found, a separate child scope object will be created under the root scope. This is nicely summarized on [Stackoverflow](https://stackoverflow.com/questions/22785775/difference-between-scope-and-rootscope):

- Each of those scope objects has its own unique identifier ($id) which is incremented automatically.

- On this [Stackoverflow](https://stackoverflow.com/questions/21287794/angularjs-controller-as-syntax-clarification) link there is another picture of how the 3 parts work together:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/c/c53eaecd88bec255af73d63944a8c5af7154f3ef.jpeg)

But I don't know how this is setup in the Node-RED dashboard (how many controllers ...). I'm afraid I cannot help you further with this ...

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [27 December 2018 17:51 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/30 "2018-12-27T17:51:33Z")

</div>

Thanks Bart for the helpful illustrations. That makes more sense now.  
In that perspective, I was almost correct in what the id is.  
Instead, each widget is added into the rootscope and each widget can be accessed by its unique scope $id.

I still don’t know why the widget id would increment after every passing breakpoint?  
Maybe the controller gets reloaded after a breakpoint?

I’m going to do some more research and looking over the current dashboard nodes.

---

<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:** [27 December 2018 19:43 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/31 "2018-12-27T19:43:34Z")

</div>

> [@seth350](#):
>
> I still don’t know why the widget id would increment after every passing breakpoint?

I'm **100%** guessing now.  
**Would be better if you got help here from somebody that has experience with AngularJs...**

On [stackoverflow](https://stackoverflow.com/questions/21021951/directive-template-unique-ids-for-elements) I see that unique id's can be generated like this:

```auto
<div class="myDirective">
      <input type="checkbox" id="myItem_{{$id}}" />
      <label for="myItem_{{$id}}">open myItem_{{$id}}</label>
</div>

```

From this [explanation](https://angular.io/guide/template-syntax#interpolation----) I understand that {{$id}} is a template expression, which is evaluated by AngularJs and converted to a string value. And it can indeed be evaluated, since `$id()` seems to be an AngularJs built-in [function](https://github.com/angular/angular.js/blob/v1.3.0/src/ng/rootScope.js#L127):

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/6/6616a0be0422f230a3e2f2b0c0038c963b348216.png)

As a result when you do `scope.$eval('$id')` or `{{$id}}`, I assume that nextUid() **function is executed** and the id is incremented. Does this makes sense and can you test that? Although then I don't get this [example](https://stackoverflow.com/a/36474469), where you can do `$scope.id = 0` 🥴

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [27 December 2018 21:26 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/32 "2018-12-27T21:26:13Z")

</div>

I did some testing in a standard ui\_template node.

I do believe we have found once and for all on how to individualize each widget.

Your last post @BartButenaers gave me some ideas.

It was this simple.

```auto
<div id="lg_{{$id}}">
        <text class="lgText" dx="10" dy="3">{{msg.payload.Tank41_Temp_Actual}}F°</text>

```

This alone will give the id a unique id just like the other standard dashboard nodes have.  
Each time you deploy a change that causes the dashboard to reload, a new $id will be assigned where you place  
`{{$id}}`.

In order to do the cool stuff like change html or properties, you can do it like so:  
`var ptr = document.getElementById("lgPtr_"+scope.$eval('$id'))`

You can then reference the object elsewhere with jQuery.

```auto
                    $(ptr).animate(
                        {'foo':value},
                        {
                            step: function(foo){
                                $(this).attr('transform', 'translate(10,'+foo+')rotate(90)');
                            },
                            duration: 400
                        }
                        );

```

Note that I tried the following and it did not work:  
`$("#lgPtr_{{$id}}")`  
`$("#lgPtr_"+scope.$eval('$id')`

Next thing is to tie this all together. I will most likely have to revert to inline styling for the scale areas instead of using CSS, and also for the other elements. I will need to also do some testing with passing the default values into the initController. It seems that `config` is not available in there.

Thank you again for all the support. It would not be possible without this community!

---

<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:** [27 December 2018 21:32 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/33 "2018-12-27T21:32:04Z")

</div>

Nice work! A bit unfortunate for all the free time you have to spend on it, but others will benefit from it later on ...

> [@seth350](#):
>
> You can then reference the object elsewhere with jQuery

What is the link between jQuery (flow editor) and AngularJS (dashboard)?

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [27 December 2018 21:40 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/34 "2018-12-27T21:40:34Z")

</div>

I suppose I meant to say elsewhere as in within:

```auto
(function(scope) {
                scope.$watch('msg', function(msg) {

```

I have only tested within the `(function(scope)` in the ui\_template. My guess is that it should function the same in the widget's `initController`. As that is where the code resides now in the linear gauge widget.  
I.E., here

```auto
initController: function($scope, events) {
                    debugger;
                    $scope.flag = true;
                    $scope.$watch('msg', function(msg) {
                        var input = msg.payload
                        var maxRange = msg.highlimit
                        var minRange = msg.lowlimit
                        var minScale = 0
                        var maxScale = 188 //this is the length of the gauge
                        var setP = msg.setpoint
............

```

I hope it turns out as well as I'd like it to. I know I will personally make good use of it. I have 20+ lined up across my dashboard in ui\_templates. Making changes takes a bit of time.

Getting this into a parameterized widget will be really nice! 🙂

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [28 December 2018 06:29 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/35 "2018-12-28T06:29:34Z")

</div>

Finally got to do some testing in the actual widget and it was unsuccessful.👎  
.......at first!

What I have found is that there are two different `scope`.  
One is `$scope` and the other is `scope`.  
Either one will return a different `$id`. In the case of creating a ui node, you must use `$scope.$eval('$id')` to reference an `$id` in the HTML.

A screenshot of what it looks like now.  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/b/b889a9717755c3286dead1f478430e1f5445fd2f.png)

Much better! Now the pointers are acting independently of one another.

Next is to address the colors...

Getting rid of the CSS and placing the styling inline like so:

```auto
<rect class="scaleArea1_{{$id}}" x="0" y="141" width="20" height="47" stroke="#000" stroke-width="1px" fill="` + config.colorLowArea + `"></rect>

```

Got me this:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/7/7e7032a348e30764e88dbbba6fa6d68e016ff237.png)

A working ui node!

Last thing to address is the ability to set default limits and setpoint in the node configuration.

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/2X/b/b6d5b0741f67f9b43a9339083aa4c2139416c6dc.png)

My problem is getting the limits and setpoint values into the initController.  
For now I am removing them and only allowing those values to be passed in by a msg.

Thanks for all the help!

Github and npm are now updated with the latest working version.

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

---

<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:** [28 December 2018 09:17 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/36 "2018-12-28T09:17:54Z")

</div>

Cool! The code is very compact, so very useful for developers to start from it...  
I have deleted my linear-gauge repository on Github.

A few remarks, in case you have some time left somewhere.  
I had already had a look at them, but without success. Hopefully @dceejay or @nisiyama or any other great mind can assis you further...

- You have some `debugger;` **statements** in your code. Better to remove those, because not everybody (who has his debugger open) wants to break at all those locations.

- When I drag a new lineargauge node into my flow editor, I immediately get an **error indication** (red circle):

- When you don't inject a message at startup, the labels look a bit weird:

- I have tried to get the limits and setpoint values into the initController, but I also couldn't accomplish that 🥴. I have no clue whether the config data is available here somewhere at the client side at this moment ... It would be very useful to have the config here.

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [28 December 2018 09:31 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/37 "2018-12-28T09:31:03Z")

</div>

> [@BartButenaers](#):
>
> When I drag a new lineargauge node into my flow editor, I immediately get an **error indication** (red circle):

That is true of all UI nodes. They need to be assigned to a group to get displayed.

When you open the edit dialog, if the group is undefined it picks the first in the list. That is the same behaviour with all other config nodes - such as the mqtt/mqtt-broker nodes.

---

<div class="post-metadata">

**Author:** ![seth350](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/seth350/32/4617_2.png) [@seth350](https://discourse.nodered.org/u/seth350)\
**Post date:** [28 December 2018 13:03 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/38 "2018-12-28T13:03:32Z")

</div>

Doh!  
I was so happy to have got it working I missed the debuggers.

I will add some more code to check for empty payloads and limits.

We can also go back and comment all of the required/boiler-plate code.  
We could even make a very simple node for everyone to begin with. A text node that allows the user to configure the size and color maybe? Attach a tutorial in the package that is downloaded when the user installs from npm?

---

<div class="post-metadata">

**Author:** ![knolleary](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knolleary/32/3_2.png) [@knolleary](https://discourse.nodered.org/u/knolleary)\
**Post date:** [28 December 2018 13:25 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/39 "2018-12-28T13:25:00Z")

</div>

> [@seth350](#):
>
> Attach a tutorial in the package that is downloaded when the user installs from npm?

I have an open task to create a repository on GitHub under the Node-RED organisation for us to maintain extra UI nodes. That repo would be a good place to host a great worked example node and to ensure its readme has good docs for creating these nodes.

If you wanted to collaborate on that, given what you've learnt with this node, that would be most welcome.

---

<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:** [28 December 2018 13:58 UTC](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001/40 "2018-12-28T13:58:32Z")

</div>

Hey Nick (@knolleary), I would also like to collaborate on it. Please share the Github link with us, whenever you have created the repository.

[Previous page](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001.md?page=1)

[Next page](https://discourse.nodered.org/t/a-linear-gauge-for-node-red/6001.md?page=3)
