HowTo: pxlBlck - Relatieve waarden weergeven als staafdiagram

Ik begon met het documenteren van de pxlBlcks (die al lang uitgesteld waren) in november 2020 nadat Hackaday.com de ‘GoodBye 2020’-uitdaging had aangekondigd. (Meer informatie hier: https://hackaday.io/contest/175608-goodbye-2020/details)

Ik gebruikte de pxlBlcks toen al heel lang, maar zoals zo vaak vond ik nooit de tijd/motivatie om het allemaal op te schrijven.

Iedereen die de hierboven genoemde beschrijving van de uitdaging heeft gelezen, heeft misschien gemerkt dat de uitdaging heel goed aansluit bij het scala aan functies van de pxlBlcks. Er worden al heel lang scrollende teksten op weergegeven. Zo kan bijvoorbeeld zonder grote problemen een bericht “Good Bye 2020” worden weergegeven.

Dankzij een tip van een van de eerste testers van de pxlBlck plugin kwam ik op een ander idee hoe je nog beter kunt visualiseren wanneer het jaar 2020 eindelijk achter de rug is: Een soort laadbalk die visualiseert hoeveel dagen van het jaar 2020 zijn al weg en blijven dienovereenkomstig.

Hiervoor heb ik een nieuw commando geïmplementeerd in de pxlBlck plugin waarmee maximaal vijf relatieve (procentuele) waarden op het display getoond kunnen worden. U kunt niet alleen het einde van een periode weergeven, maar ook verschillende geschaalde (als de waarde absoluut is) of relatieve waarden.

Zo kan de waarde van de relatieve luchtvochtigheid heel goed worden weergegeven omdat deze waarde al relatief is en overeenkomt met een procentuele waarde. Om absolute waarden weer te geven moet je wat meer “wiskunde” gebruiken. Klinkt ingewikkeld. Maar het is niet.

In het volgende artikel wordt beschreven hoe je relatieve waarden in een laadbalk kunt weergeven op het display van je pxlBlck.

Tot ziens 2020 🙂

Veiligheidsinstructies

Ik weet dat de volgende opmerkingen altijd een beetje vervelend zijn en onnodig lijken. Helaas hebben veel mensen die "beter" wisten door onvoorzichtigheid ogen, vingers of andere dingen verloren of zichzelf verwond. Gegevensverlies is in vergelijking bijna te verwaarlozen, maar zelfs dit kan erg vervelend zijn. Neem daarom vijf minuten de tijd om de veiligheidsinstructies te lezen. Omdat zelfs het coolste project geen blessure of andere problemen waard is.
https://www.nerdiy.de/sicherheitshinweise/

Affiliate links / reclame links

De hier vermelde links naar online winkels zijn zogenaamde affiliate-links. Als u op zo'n affiliate-link klikt en via deze link een aankoop doet, ontvangt Nerdiy.de een commissie van de betreffende onlineshop of aanbieder. De prijs verandert voor jou niet. Als u via deze links uw aankopen doet, steunt u Nerdiy.de om in de toekomst andere nuttige projecten aan te kunnen bieden. 🙂 


Eisen

Om de informatie in dit artikel te kunnen gebruiken, moet u uw pxlBlck al hebben ingesteld en geprogrammeerd. Informatie hierover vindt u in de volgende artikelen.

Vereist gereedschap:
- Nee -

Benodigd materiaal:
- Nee -


De opdracht voor het plotten van relatieve waarden

Het volgende commando is geschikt voor het weergeven van relatieve of beperkte absolute waarden op het display van de pxlBlck. De “richting” van de gevisualiseerde laadbalk op het display kan worden ingesteld. Bovendien kan een “gevulde” vlag worden ingesteld voor de eerste van de verzonden relatieve waarden. Dit betekent dat het weergavegebied in de ingestelde kleur van nul tot de gewenste waarde wordt gekleurd. Last but not least kan de weergavekleur van elke afzonderlijke waarde worden aangepast.

Zie je liever voorbeelden: scrol dan even verder. Hieronder heb ik verschillende voorbeelden opgesomd inclusief de gebruikte commando's.

commando naam

pbbar

commando overzicht

pbbar,[weergave_duur1-86400000],[gespiegeld 0-1],[eerste_balk_gevuld 0-1],[weergave_richting 0-1],[bar_graph_value 0-100],[rood 0-255],[groente 0-255],[blauw 0-500],[maximaal vier aanvullende waardegroepen]

Parameterbeschrijving

parameternaamBeschrijvingToegestaan bereik van waarden
weergave_duurDeze parameter definieert de weergavetijd van de weergegeven waarde. Dit begint nadat alle waarden op het display zijn weergegeven.1-86400000
gespiegeldU kunt deze parameter gebruiken om de weergave van de waarde te spiegelen. Met behulp van de parameter “weergave_richting”de BarGraph kan in alle richtingen worden uitgelijnd. 0-1
eerste_balk_gevuldMet deze parameter wordt de gevulde weergave voor de eerste waarde in- of uitgeschakeld. Dus als u de eerste waarde instelt op 25 en deze parameter is geactiveerd, wordt 25% van de matrix “gevuld” met de gewenste kleur voor deze parameter. 0-1
weergave_richtingDeze parameter configureert of de waarde horizontaal (0) of verticaal (1) wordt weergegeven. Met behulp van de parameter “gespiegeldDeze oriëntatie kan ook worden weerspiegeld.0-1
directe_uitvoerStaat deze optie ingesteld (=1) dan wordt de waarde direct op het display getoond. De weergaveanimatie wordt dus niet weergegeven.0-1
bar_graph_valueDit is de werkelijke waarde tussen 0 en 100 die u wilt vertegenwoordigen.0-100
roodDeze parameter bepaalt de helderheid van de rode kleur van de bijbehorende waarde.0-255
groenteDeze parameter bepaalt de helderheid van de groene kleur van de bijbehorende waarde.0-255
blauwDeze parameter bepaalt de helderheid van de blauwe kleur van de bijbehorende waarde.0-255
Voorbeeld

Meer gedetailleerde informatie, inclusief afbeeldingen en video's van de verschillende weergaven en hoe u deze op uw pxlBlck kunt weergeven, vindt u in de volgende paragraaf.


Geef meer dan één waarde tegelijk weer

Als u slechts één waarde op het display van uw pxlBlck wilt visualiseren, is de structuur van het commando vrij eenvoudig. U kunt bovenstaande tabel als richtlijn gebruiken. Een opdracht om slechts één waarde weer te geven, kan er bijvoorbeeld zo uitzien.

  • pbbar,10000,1,1,0,0,75,50,00,0,

Deze opdracht toont voor 10 seconden (=10000ms) de gespiegeld en gevuld Waarde 75 met animatie in de rode kleur bij.

Als u nu (zo maximaal mogelijke) vijf waarden wilt weergeven, zou het commando er als volgt uit kunnen zien.

  • pbbar,10000,1,1,0,0,10,255,0,0,25,0,255,0,50,0,0,255,75,0,255,255,100,255,0,255,

In het gegeven voorbeeld heb ik de instellingen voor de afzonderlijke waarden in kleur gemarkeerd. De eerste waarde en de bijbehorende kleurinstellingen zijn rood gemarkeerd, de tweede in oranje, de derde in groen, de vierde in blauw en de vijfde in roze.

Je kunt dus met slechts één commando meerdere waarden naar de pxlBlck sturen voor weergave. Zorg er echter voor dat er maximaal vijf waarden tegelijk kunnen worden weergegeven.


Voorbeeld: gebruik regels om elk uur een gedefinieerde duur voor een datum weer te geven

Als u bijvoorbeeld wilt laten zien (zoals hierboven vermeld) wanneer het huidige jaar (2020) (eindelijk) eindigt, kunt u de volgende regels gebruiken.

Deze regels berekenen het verschil tot 1 januari 2020 00:00 uur vanaf de huidige datum of tijd en zetten dit verschil om in een percentage. Dit percentage wordt vervolgens gebruikt om de opdracht “pbbar” te “voeden”. Omdat de weergave op de pxlBlck_32x8 en de pxlBlck_RingClock enigszins van elkaar verschillen, vindt u hieronder twee enigszins verschillende codes voor de regels van uw pxlBlck.

Omdat de pxlBlck_32x8 ook scrollende tekst kan weergeven, omvat het regelvoorbeeld voor de pxlBlck_32x8 ook de automatische uitvoer van “tot ziens”-berichten (in verschillende talen). (Waarom? Zie de ‘GoodBye 2020’-uitdaging hierboven. 🙂).

De regels worden elke minuut geactiveerd door de gebeurtenis “Clock#Time”. Informatie over de ESP Easy Rules vindt u onder andere via de volgende links.

Weergave van de onderstaande regels Op de displays van de plBlck_32x8, pxlBlck_8x8 en de pxlBlck_RingClock.

Voor pxlBlck_RingClock

Hier het regelvoorbeeld voor de pxlBlck_RingClock.

on Clock#Time=All,**:** do //1577833200=unixtime op "1.1.2020 @ 00:00" let,1,%unixtime%-1577833200 //berekening van seconden verstreken sinds 1.1.2020 @ 00:00 let,1, %v1%/60 //omrekenen naar minuten verstreken sinds 1.1.2020 om 00:00 let,1,%v1%/60 //omrekenen naar verstreken uren sinds 1.1.2020 om 00:00 let,1,%v1%/24 //omrekenen naar dagen geslaagd sinds 1.1.2020 @ 00:00 let,2,%v1%/365 // relatieve waarde berekenen van "hoeveel dagen van het jaar 2020 zijn verstreken" let,2,%v2%*100 // relatieve (float) waarde omzetten in percentage pbbar,10000,1,1,0,%v2%,50,00,0, endon

Voor pxlBlck_32x8

Hier het regelvoorbeeld voor de pxlBlck_RingClock.

on Clock#Time=All,**:** do //1577833200=unixtime op "1.1.2020 @ 00:00" let,1,%unixtime%-1577833200 //berekening van seconden verstreken sinds 1.1.2020 @ 00:00 let,1, %v1%/60 //omrekenen naar minuten verstreken sinds 1.1.2020 om 00:00 let,1,%v1%/60 //omrekenen naar verstreken uren sinds 1.1.2020 om 00:00 let,1,%v1%/24 //omrekenen naar dagen geslaagd sinds 1.1.2020 @ 00:00 let,2,%v1%/365 // relatieve waarde berekenen van "hoeveel dagen van het jaar 2020 zijn verstreken" let,2,%v2%*100 // relatieve (float) waarde omzetten in percentage pbbar,2000,0,1,1,%v2%,0,10,0, Delay 2000 // om wat tijd te geven voor de weergave van de balkinstelling pbrntxt,10,10,10,0,0,0,25,8 ,Au Revoir - Adios - Vaarwel - Do Svidaniya - Güle güle - Aloha - Selamat tinggal - DaH jImej - Sayonara - Ik ben groot., endon

continu de resterende tijd weergeven

In het geval dat u de resterende tijd (of een andere weergegeven waarde) continu wilt weergeven, hoeft u alleen de weergavetijd zo hoog in te stellen dat deze groter is dan het update-interval van de weergave.

Dus als u elke minuut een waarde op het display wilt weergeven en deze permanent of tot de volgende update moet worden weergegeven, moet u de waarde voor weergave_duur ingesteld op (minstens) 60000 (ms).


Voorbeeld: Stuur relatieve (percentage) waarde van NodeRed en geef deze weer op de pxlBlck

Een voorbeeld van hoe u een relatieve procentuele waarde (d.w.z. een waarde van 0-100) van NodeRed naar de pxlBlck kunt sturen en op het display kunt weergeven, vindt u in de volgende NodeCode.

Hier ziet u de weergave van het voorbeeld in de NodeRed-editor.
Om het voorbeeld te laten werken, moet je natuurlijk de naam van je pxlBlck wijzigen. Informatie hierover vindt u hieronder bij de hier genoemde voorbeelden.

U vindt de code voor de hier beschreven NodeRed-voorbeelden onder de volgende link.

Hoe u verder kunt gaan om dit in uw NodeRed-installatie te importeren, wordt beschreven in het volgende artikel.

Bekijk op het display als u het hierboven gegeven NodeRed-voorbeeld gebruikt.

Voorbeeld: stuur niet-relatieve waarden vanuit NodeRed en geef ze weer op de PxlBlck

Dit voorbeeld laat zien hoe je met NodeRed ook niet-relatieve waarden naar je pxlBlck kunt sturen. Om dit te laten werken, worden de absolute waarden “omlaag” en “omhoog” beperkt met behulp van het bereikknooppunt en geschaald naar het waardebereik 0-100 van de pxlBlck. Dit gebeurt in het knooppunt genaamd "set toegestaan bereik voor schaling".

Hier ziet u de weergave van het voorbeeld in de NodeRed-editor.
Om het voorbeeld te laten werken, moet je natuurlijk de naam van je pxlBlck wijzigen. Informatie hierover vindt u hieronder bij de hier genoemde voorbeelden.

U vindt de code voor de hier beschreven NodeRed-voorbeelden onder de volgende link.

Hoe u verder kunt gaan om dit in uw NodeRed-installatie te importeren, wordt beschreven in het volgende artikel.


Voorbeeld: Stuur vanuit NodeRed vijf relatieve waarden en toon ze tegelijkertijd op de PxlBlck

Dit voorbeeld laat zien hoe je met NodeRed vijf waarden tegelijkertijd naar je pxlBlck kunt sturen. Daarnaast kunnen ook de weergaveopties worden ingesteld. De individuele waarden worden verzameld in variabelen en met een druk op de knop gecombineerd tot een commando (“send to pxlBlck”) en naar de pxlBlck gestuurd.

Hier ziet u de weergave van het voorbeeld in de NodeRed-editor.
Om het voorbeeld te laten werken, moet je natuurlijk de naam van je pxlBlck wijzigen. Informatie hierover vindt u hieronder bij de hier genoemde voorbeelden.

U vindt de code voor de hier beschreven NodeRed-voorbeelden onder de volgende link.

Hoe u verder kunt gaan om dit in uw NodeRed-installatie te importeren, wordt beschreven in het volgende artikel.

Bekijk op het display van de pxlBlck_32x8 als je het NodeRed-voorbeeld hierboven gebruikt. De eerst weergegeven waarde (groen) heeft eerst de waarde 25, dan 50 en dan 0.

Informatie over de aanpassing/configuratie van de vermelde NodeRed-voorbeelden

U moet de bovenstaande voorbeelden een beetje aanpassen voordat u ze met succes kunt testen.

Om dit te doen, moet u de juiste naam van uw pxlBlck invoeren in het MQTT-knooppunt.

In het voorbeeld aan de linkerkant is de naam van degene die ik gebruik pxlBlcks

pxlBlck_32x8_ESP32

U moet dit deel van het onderwerp wijzigen en natuurlijk de naam van uw pxlBlck daar invoeren.

Hier zie je de inhoud van het eerste functieknooppunt.

Hier hoef je niets te veranderen. Het is echter de moeite waard om hier een kijkje te nemen als u geïnteresseerd bent in hoe het commando is samengesteld en waar de gegevens vandaan komen. 🙂


Veel plezier met het project

Ik hoop dat alles werkte zoals beschreven. Zo niet, of als je vragen of suggesties hebt, laat het me weten in de commentaren. Ik zal dit dan zo nodig aan het artikel toevoegen.
Ideeën voor nieuwe projecten zijn altijd welkom. 🙂

PS Veel van deze projecten - vooral de hardwareprojecten - kosten veel tijd en geld. Natuurlijk doe ik dit omdat ik het leuk vind, maar als je het cool vindt dat ik de informatie met je deel, dan zou ik blij zijn met een kleine donatie aan het koffiefonds. 🙂

Koop Me a Coffee op ko-fi.com       

4 comments

  1. Hallo, bedankt voor je geweldige project en geweldige documentatie.

    Heb je de STL-bestanden vrijgegeven voor de pxlBlck_32x8?

    1. Hallo Ronny,
      dat zou eigenlijk moeten werken. Ik heb het getest met de volgende opdracht en de spaties erin werden ook weergegeven.
      pbrntxt,0,255,0,0,0,0,50,8,T estbericht,
      Als het niet voor u werkt, stuur me dan de opdracht die u naar de pxlBlck hebt gestuurd. 🙂
      Hartelijke groeten
      Fabian

Kommentar hinterlassen

Het e-mailadres wordt niet gepubliceerd. Erforderliche Felder sind mit * markiert

Deze site gebruikt Akismet om spam te verminderen. Bekijk hoe je reactie-gegevens worden verwerkt.