Can't get hotNipi gauge to work

General
1

Hi,

I have had a look at hotNipis gauge on Github, however when I copy the node-red example code and paste it into a ui-template as stated together with an inject node for some numbers, all i get is a white box when i open Dashboard2, am I doing it wrong ?

Thanks

2

Provide a link to the github page please.

1 Like
3

Hi Colin,

The link is:

Thanks

4

OK, so this is the web component version of the gauge. Gifted by hotnipi to the community and hosted by me with a few tweaks for the web component wrapper.

It should, I think, work with D2 but I can't say I've tested it. It does work with UIBUILDER. It would also work with http-in/-response nodes.

Open your browser's dev tools, look at the console and report back what errors you see.

5

Hi Totally,

I can't take a screenshot of the Dev screen but it says this:

The resource from “http://localhost:1880/js/gauge-hotnipi.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
page1
Loading failed for the <script> with source “http://localhost:1880/js/gauge-hotnipi.js”. page1:1:1
errorCaptured TypeError: this.getElement(...).update is not a function

Thanks

6

How have you made the component available to D2?

I see that I haven't shared any methods on how to do that in the repo.

If you were using it with UIBUILDER, you could simply install the github version using uibuilder's library manager. But if you aren't doing that, you will need to put gauge-hotnipi.iife.min.js into a location that Node-RED will serve to the D2 front-end (as indicated by the "browser" property in the package.json file). You would then reference that in a link in a ui_template node. The minimised version will be optimised unlike the version you've used.

1 Like
7

Hi Totally,

I just did like it said in the Node-Red example, put a template node in node red with the code supplied and that is all I did apart from adding an inject node with a number to try it.

Thanks

8

I've just added some installation instructions to the GitHub repo.

If not using UIBUILDER, you will need to configure a static resource folder for Node-RED - see the property in settings.js. Then copy the file to that folder. Node-RED will serve anything in that folder automatically.

1 Like
9

Hi Totally,

Thanks for doing that I will have a go after work.

Thanks