# Atmospheric pressure with Trend calculator

**URL:** <https://discourse.nodered.org/t/atmospheric-pressure-with-trend-calculator/97060>\
**Category:** Share Your Projects\
**Created:** [14 May 2025 03:59 UTC](https://discourse.nodered.org/t/atmospheric-pressure-with-trend-calculator/97060 "2025-05-14T03:59:29Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![repho](https://avatars.discourse-cdn.com/v4/letter/r/8e8cbc/32.png) [@repho](https://discourse.nodered.org/u/repho)\
**Post date:** [14 May 2025 03:59 UTC](https://discourse.nodered.org/t/atmospheric-pressure-with-trend-calculator/97060/1 "2025-05-14T03:59:29Z")

</div>

I've been suggested to share my little project, so here it is.  
I have a atmospheric pressure sensor and wanted to get a little weather prediction on my dashboard:

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

And here are the nodes used to get this:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/9/3/93f6e58a286beb56c3c6fadbb80974f89ae20cad.png)

```auto
[
    {
        "id": "1a7965f3b14b7163",
        "type": "tab",
        "label": "Flow 1",
        "disabled": false,
        "info": "",
        "env": []
    },
    {
        "id": "f4ef17549bcdd8bf",
        "type": "inject",
        "z": "1a7965f3b14b7163",
        "name": "",
        "props": [
            {
                "p": "payload"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "1009.54",
        "payloadType": "str",
        "x": 120,
        "y": 180,
        "wires": [
            [
                "48355c7d023f2b70",
                "9499014ebc5d53b3",
                "5139626cee6bf13b",
                "6ed5d7e114155f42"
            ]
        ]
    },
    {
        "id": "48355c7d023f2b70",
        "type": "ui-gauge",
        "z": "1a7965f3b14b7163",
        "name": "ATM Press",
        "group": "63cc085a2f9ed996",
        "order": 4,
        "width": "3",
        "height": 3,
        "gtype": "gauge-half",
        "gstyle": "needle",
        "title": "ATM Press",
        "units": "hPa",
        "icon": "",
        "prefix": "",
        "suffix": "",
        "segments": [
            {
                "from": "980",
                "color": "#0032ff"
            },
            {
                "from": "1009",
                "color": "#00ff32"
            },
            {
                "from": "1026",
                "color": "#ffbb00"
            }
        ],
        "min": "980",
        "max": "1050",
        "sizeThickness": 16,
        "sizeGap": 4,
        "sizeKeyThickness": 8,
        "styleRounded": true,
        "styleGlow": false,
        "className": "",
        "x": 330,
        "y": 100,
        "wires": []
    },
    {
        "id": "9499014ebc5d53b3",
        "type": "change",
        "z": "1a7965f3b14b7163",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "press",
                "pt": "global",
                "to": "payload",
                "tot": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 700,
        "y": 120,
        "wires": [
            []
        ]
    },
    {
        "id": "5139626cee6bf13b",
        "type": "function",
        "z": "1a7965f3b14b7163",
        "name": "Trend calc",
        "func": "var oldp = global.get(\"oldp\");\nmsg.payload = ((msg.payload - oldp) * 100).toFixed(0);\nreturn msg;",
        "outputs": 1,
        "timeout": 0,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "libs": [],
        "x": 330,
        "y": 160,
        "wires": [
            [
                "5a6a8e3100cf5bf5",
                "2d85289ff1258b48"
            ]
        ]
    },
    {
        "id": "6ed5d7e114155f42",
        "type": "change",
        "z": "1a7965f3b14b7163",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "topic",
                "pt": "msg",
                "to": "pressure/old",
                "tot": "str"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 330,
        "y": 200,
        "wires": [
            [
                "9b793199dcd5d16d"
            ]
        ]
    },
    {
        "id": "5a6a8e3100cf5bf5",
        "type": "ui-template",
        "z": "1a7965f3b14b7163",
        "group": "63cc085a2f9ed996",
        "page": "",
        "ui": "",
        "name": "Trend",
        "order": 9,
        "width": 3,
        "height": 0,
        "head": "",
        "format": "<template>\n <div class=\"panning-knob\">\n <label class=\"pan-label\">10m Trend (<span v-text=\"value\"></span>)</label>\n <input\n type=\"range\"\n min=\"-30\"\n max=\"30\"\n v-model=\"value\"\n @input=\"send(value)\"\n class=\"slider\"\n />\n <div class=\"pan-indicator\">\n <span :class=\"{ activeL: value < -10 }\">Rainy</span>\n <span :class=\"{ activeM: value >= -10 && value <= 10 }\">Stable</span>\n <span :class=\"{ activeR: value > 10 }\">Clearing</span>\n </div>\n </div>\n</template>\n\n<style scoped>\n .panning-knob {\n width: 320px;\n padding: 20px 10px 10px 10px;\n background: white;\n border-radius: 12px;\n //box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);\n display: flex;\n flex-direction: column;\n align-items: center;\n }\n\n .pan-label {\n color: black;\n font-size: 14px;\n margin-bottom: 6px;\n letter-spacing: 1px;\n }\n\n .slider {\n width: 100%;\n margin: 0 0 8px 0;\n -webkit-appearance: none;\n background: linear-gradient(90deg, #2196f3 0%, #eee 50%, #f44336 100%);\n height: 8px;\n border-radius: 4px;\n outline: none;\n transition: background 0.3s;\n }\n\n .slider::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 22px;\n height: 22px;\n border-radius: 50%;\n background: green;\n border: 1px solid #333;\n cursor: pointer;\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n transition: background 0.2s;\n }\n /* .triangle{\n width: 0;\n height: 0;\n border-top: 10px solid transparent;\n border-bottom: 10px solid transparent;\n border-right:10px solid blue;\n } */\n\n .slider::-moz-range-thumb {\n width: 22px;\n height: 22px;\n border-radius: 50%;\n background: #ffeb3b;\n border: 2px solid #333;\n cursor: pointer;\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n transition: background 0.2s;\n }\n\n .slider::-ms-thumb {\n width: 22px;\n height: 22px;\n border-radius: 50%;\n background: #ffeb3b;\n border: 2px solid #333;\n cursor: pointer;\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);\n transition: background 0.2s;\n }\n\n .slider:focus {\n outline: none;\n }\n\n .pan-indicator {\n display: flex;\n justify-content: space-between;\n width: 100%;\n font-size: 13px;\n color: #888;\n margin-top: 2px;\n }\n\n .pan-indicator span {\n flex: 1;\n text-align: center;\n font-weight: bold;\n opacity: 0.7;\n }\n\n .pan-indicator .activeL {\n color: blue;\n opacity: 1;\n }\n .pan-indicator .activeM {\n color: green;\n opacity: 1;\n }\n .pan-indicator .activeR {\n color: gold;\n opacity: 1;\n }\n</style>",
        "storeOutMessages": true,
        "passthru": true,
        "resendOnRefresh": true,
        "templateScope": "local",
        "className": "",
        "x": 510,
        "y": 100,
        "wires": [
            []
        ]
    },
    {
        "id": "2d85289ff1258b48",
        "type": "change",
        "z": "1a7965f3b14b7163",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "trend",
                "pt": "global",
                "to": "payload",
                "tot": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 700,
        "y": 160,
        "wires": [
            []
        ]
    },
    {
        "id": "9b793199dcd5d16d",
        "type": "delay",
        "z": "1a7965f3b14b7163",
        "name": "",
        "pauseType": "delay",
        "timeout": "600",
        "timeoutUnits": "seconds",
        "rate": "1",
        "nbRateUnits": "1",
        "rateUnits": "second",
        "randomFirst": "1",
        "randomLast": "5",
        "randomUnits": "seconds",
        "drop": false,
        "allowrate": false,
        "outputs": 1,
        "x": 510,
        "y": 200,
        "wires": [
            [
                "df4e064331e5892a"
            ]
        ]
    },
    {
        "id": "df4e064331e5892a",
        "type": "change",
        "z": "1a7965f3b14b7163",
        "name": "",
        "rules": [
            {
                "t": "set",
                "p": "oldp",
                "pt": "global",
                "to": "payload",
                "tot": "msg"
            }
        ],
        "action": "",
        "property": "",
        "from": "",
        "to": "",
        "reg": false,
        "x": 700,
        "y": 200,
        "wires": [
            []
        ]
    },
    {
        "id": "63cc085a2f9ed996",
        "type": "ui-group",
        "name": "Aer",
        "page": "863c7875112d9869",
        "width": "12",
        "height": 1,
        "order": 5,
        "showTitle": true,
        "className": "",
        "visible": "true",
        "disabled": "false",
        "groupType": "default"
    },
    {
        "id": "863c7875112d9869",
        "type": "ui-page",
        "name": "Home",
        "ui": "5bd117d7db0d2853",
        "path": "/page1",
        "icon": "home",
        "layout": "grid",
        "theme": "bdb038ab42cbbbb6",
        "breakpoints": [
            {
                "name": "Default",
                "px": "0",
                "cols": "3"
            },
            {
                "name": "Tablet",
                "px": "576",
                "cols": "6"
            },
            {
                "name": "Small Desktop",
                "px": "768",
                "cols": "9"
            },
            {
                "name": "Desktop",
                "px": "1024",
                "cols": "12"
            }
        ],
        "order": 1,
        "className": "",
        "visible": true,
        "disabled": false
    },
    {
        "id": "5bd117d7db0d2853",
        "type": "ui-base",
        "name": "My Dashboard",
        "path": "/dashboard",
        "appIcon": "",
        "includeClientData": true,
        "acceptsClientConfig": [
            "ui-notification",
            "ui-control"
        ],
        "showPathInSidebar": false,
        "headerContent": "page",
        "navigationStyle": "temporary",
        "titleBarStyle": "default",
        "showReconnectNotification": true,
        "notificationDisplayTime": 1,
        "showDisconnectNotification": true,
        "allowInstall": true
    },
    {
        "id": "bdb038ab42cbbbb6",
        "type": "ui-theme",
        "name": "Default Theme",
        "colors": {
            "surface": "#ffffff",
            "primary": "#0094CE",
            "bgPage": "#eeeeee",
            "groupBg": "#ffffff",
            "groupOutline": "#cccccc"
        },
        "sizes": {
            "density": "default",
            "pagePadding": "12px",
            "groupGap": "12px",
            "groupBorderRadius": "4px",
            "widgetGap": "12px"
        }
    }
]

```

---

<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:** [14 May 2025 08:02 UTC](https://discourse.nodered.org/t/atmospheric-pressure-with-trend-calculator/97060/2 "2025-05-14T08:02:52Z")

</div>

Nice. Though I think I'd drop the DP's and make the display kPa to keep things neater. 🙂

---

<div class="post-metadata">

**Author:** ![repho](https://avatars.discourse-cdn.com/v4/letter/r/8e8cbc/32.png) [@repho](https://discourse.nodered.org/u/repho)\
**Post date:** [14 May 2025 09:23 UTC](https://discourse.nodered.org/t/atmospheric-pressure-with-trend-calculator/97060/3 "2025-05-14T09:23:00Z")

</div>

Yes, the flow is set in kPa, the pic is a little older, before the transformation!