OpenMarine

Full Version: [SOLVED] Signal k instrumentpanel it is not visible
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
If I go to
http://localhost:3000/instrumentpanel
menu appears but does not display the instrument, how do you connect?

Solved!
After clicking connect you only need to enter ip address and port as well (example): 192.168.178.25:3000
was struggling with the same problem, thanks for info!
How can the units be set - when I look in op e.g. outside pressure is correctly shown in hPa but in node-red in Pa, similar issue with degrees etc.
... maybe we should develop this thread further and share experience in configuring the instrument panel.
e.g. how could I show the history date for pressure temp etc - have not found a way to change the control.
Hi Skipper,

I'm playing around with this too, tried to:
  1. Customize the Signal-K example instrument panel;
  2. Created an specific webpage based on an example from IKommunicate to make my own page;
  3. Build custom webpages with node-red dashboard.
I'm not an developer, so my Java / python/ HTML skills are very poor. But I must say with option 3) the node-red dashboard I managed to build quickly a nice dashboard.
- I'm able to display history information, for a surface pressure sensor for example;
- I'm able to keep track of this history information even after a reboot of the PI. (without using an database)
- I was able to make input's from the webpage, to turn on a switch or whatever;
- I managed to couple an SQLite database, and put sensorinfo in the database.
- I managed to convert in and out signal-K messages.
I did not found a way (until now) to show a map or to display something advanced as closed haul wind direction instrument.

So I'm now thinking of making a mix of Node-red dashboard page for utilities management and signal_k instrument panel for navigational information.
I don't know if this is the way forward from an openplotter view, but this worked for me now.

Happy to hear your comments on this,

G.
Sounds great but I cannot get node-red to do even the simple things like showing the history of temperature and pressure.
Could you please share your code or add a little tutorial.

Thanks
(2017-01-07, 01:30 PM)SkipperEarly Wrote: [ -> ]Sounds great but I cannot get node-red to do even the simple things like showing the history of temperature and pressure.
Could you please share your code or add a little tutorial.

Thanks
Of course I can share, 

Example one get Sig-k data and display this on a dashboard

As an example, connected an BMP180 sensor to the I2C port of the PI
Configured under Openplotter I2C sensors with a rate of 60 seconds
checked with SK diagnostics if the sensor produce values:
environment.outside.pressure 1028.97 hPa
environment.outside.temperature 15.2 C

Went with my browser tot the node-red page   http://localhost:1880
Make a new tab  Upper right --> Flows --> add
Import flow Upper right --> Import --> clipboard

With the following code: (copy paste)
Code:
[
    {
        "id": "cfb5e834.bcffe8",
        "type": "websocket in",
        "z": "81f31ab4.b5ae08",
        "name": "",
        "server": "e72c4f8c.f387b",
        "client": "",
        "x": 190,
        "y": 156,
        "wires": [
            [
                "61a24b8d.5cce74"
            ]
        ]
    },
    {
        "id": "61a24b8d.5cce74",
        "type": "json",
        "z": "81f31ab4.b5ae08",
        "name": "",
        "x": 111.5,
        "y": 325,
        "wires": [
            [
                "c381a62.7d39058",
                "e87a7cf0.8c573",
                "dc7827ec.752098"
            ]
        ]
    },
    {
        "id": "2da1de6a.adc842",
        "type": "debug",
        "z": "81f31ab4.b5ae08",
        "name": "",
        "active": true,
        "console": "false",
        "complete": "false",
        "x": 1017,
        "y": 400,
        "wires": []
    },
    {
        "id": "e87a7cf0.8c573",
        "type": "jsonpath",
        "z": "81f31ab4.b5ae08",
        "expression": "$.updates..values[?(@.path==\"environment.outside.pressure\")]..value",
        "split": true,
        "name": "environment.outside.pressure",
        "x": 334,
        "y": 463,
        "wires": [
            [
                "aa7f89f4.b82938"
            ]
        ]
    },
    {
        "id": "aa7f89f4.b82938",
        "type": "delay",
        "z": "81f31ab4.b5ae08",
        "name": "",
        "pauseType": "rate",
        "timeout": "5",
        "timeoutUnits": "seconds",
        "rate": "1",
        "nbRateUnits": "5",
        "rateUnits": "minute",
        "randomFirst": "1",
        "randomLast": "5",
        "randomUnits": "seconds",
        "drop": true,
        "x": 586,
        "y": 459,
        "wires": [
            [
                "63e445c7.b275ac"
            ]
        ]
    },
    {
        "id": "63e445c7.b275ac",
        "type": "function",
        "z": "81f31ab4.b5ae08",
        "name": "Convert to hPa",
        "func": "msg.payload = msg.payload /100 ;\nreturn msg;",
        "outputs": 1,
        "noerr": 0,
        "x": 805,
        "y": 465,
        "wires": [
            [
                "2da1de6a.adc842",
                "2ae5cf.64e1aa32",
                "f9c49486.cb6a48",
                "1e649d21.5ee2c3"
            ]
        ]
    },
    {
        "id": "2ae5cf.64e1aa32",
        "type": "ui_chart",
        "z": "81f31ab4.b5ae08",
        "name": "Pressure",
        "group": "222ca4ec.fecbdc",
        "order": 0,
        "width": 0,
        "height": 0,
        "label": "Surface Pressure (hPa)",
        "chartType": "line",
        "legend": "false",
        "xformat": "%H:%M",
        "interpolate": "basis",
        "nodata": "",
        "ymin": "",
        "ymax": "",
        "removeOlder": "24",
        "removeOlderUnit": "3600",
        "x": 832,
        "y": 600,
        "wires": [
            [
                "a95eaa5d.c11a98"
            ],
            []
        ]
    },
    {
        "id": "dc7827ec.752098",
        "type": "debug",
        "z": "81f31ab4.b5ae08",
        "name": "",
        "active": false,
        "console": "false",
        "complete": "false",
        "x": 445,
        "y": 292,
        "wires": []
    },
    {
        "id": "f9c49486.cb6a48",
        "type": "ui_text",
        "z": "81f31ab4.b5ae08",
        "group": "222ca4ec.fecbdc",
        "order": 0,
        "width": 0,
        "height": 0,
        "name": "current pressure (hPa)",
        "label": "Current Pressure",
        "format": "{{msg.payload | number:0}}",
        "layout": "row-spread",
        "x": 1042,
        "y": 478,
        "wires": []
    },
    {
        "id": "a95eaa5d.c11a98",
        "type": "file",
        "z": "81f31ab4.b5ae08",
        "name": "Chart dump",
        "filename": "/home/pi/ds-charts/pressure.dump",
        "appendNewline": true,
        "createDir": true,
        "overwriteFile": "true",
        "x": 1027,
        "y": 592,
        "wires": []
    },
    {
        "id": "55be5b6f.98b964",
        "type": "inject",
        "z": "81f31ab4.b5ae08",
        "name": "Startup",
        "topic": "",
        "payload": "",
        "payloadType": "date",
        "repeat": "",
        "crontab": "",
        "once": true,
        "x": 274,
        "y": 607,
        "wires": [
            [
                "1de98e8.3039b72"
            ]
        ]
    },
    {
        "id": "1de98e8.3039b72",
        "type": "file in",
        "z": "81f31ab4.b5ae08",
        "name": "Chart dump",
        "filename": "/home/pi/ds-charts/pressure.dump",
        "format": "utf8",
        "x": 455,
        "y": 604,
        "wires": [
            [
                "9a787c23.87eb9"
            ]
        ]
    },
    {
        "id": "9a787c23.87eb9",
        "type": "json",
        "z": "81f31ab4.b5ae08",
        "name": "",
        "x": 654,
        "y": 603,
        "wires": [
            [
                "2ae5cf.64e1aa32"
            ]
        ]
    },
    {
        "id": "e72c4f8c.f387b",
        "type": "websocket-listener",
        "z": "",
        "path": "ws://localhost:3000/signalk/v1/stream",
        "wholemsg": "false"
    },
    {
        "id": "222ca4ec.fecbdc",
        "type": "ui_group",
        "z": "",
        "name": "Environment",
        "tab": "e01159e6.0f0f28",
        "disp": true,
        "width": "6"
    },
    {
        "id": "e01159e6.0f0f28",
        "type": "ui_tab",
        "z": "",
        "name": "Your_Boat_Name",
        "icon": "dashboard"
    }
]

click on "deploy"
Check if first object (connection tot localhost:3000 says "connected"
Check with the debug function if you see values
click on "dashboard" tab
click on the button directly on the right it will open an new browser tab http://localhost:1880/ui
On the dashboard you will see the current pressure and the graph for 24h

Some remarks:
a) (in node-red) the row with chart dump will take care of saving your data to a file and using this data after eg a reboot
Maybe it complains the first time because this directory will not exist "filename": "/home/pi/ds-charts/pressure.dump",
b) rate limiting messages is necessary, the dasboard can only display a limited number of datapoints. So don't try to make a graph of 24 hour with a datapoint on each second, node red will crash.

Try to make the same objects to produce something for environment.outside.temperature  (copy and paste) and change some parameters should do the job.
attached is a copy of a sample page

Hope this helps. If you want more examples let me know
G.
Thank you for the detailed instructions - managed now with your help to show history data.
Hope such instructions will find their way also into the op manual Smile

Pls keep sharing