blogy logo
login PRIHLÁS SA
BLOG deadawp
ČLÁNKY
DISKUSIE
3
SLEDUJETE BLOG
Programátor
deadawp



AR plane pre IoT zariadenia
pridal deadawp 30.7. 2025 o 11:44 (naposledy upravené 30.7. 2025 o 16:12)

Dnes si ukážeme jednoduchú implementáciu AR scény vo webaplikácii so základným plane objektom, teda 2D plochou, čo môže byť vhodná forma vizualizácie aktuálnych dát IoT zariadení, senzorových uzlov, alebo aj offline hardvéru pomocou textu, ale aj grafických vizualizácii (grafy, obrázky, embedded video). V tomto prípade bude AR scéna vyvolaná skenovaním QR kódu, čoho výsledkom bude vyobrazenie objektu plane v priestore s dátami, ktoré prislúchajú konkrétnemu hardvéru, na ktorom bol QR kód umiestnený. Plane má nastavenú nepriehľadnosť na 80% a je vyobrazený -1,3 metra od kamery, pričom má rozmery 1,2 x 1,5 metra a je tenký, teda pôsobí takmer ako neohybný list papiera.

Samotné získanie dát do AR scény môže prebiehať rôznymi spôsobmi:

  • API - HTTPS request na externý web, REST API službu pre získanie údajov (častokrát v JSON formáte)
  • Bluetooth - skrz Web Bluetooth je možné komunikovať priamo s BT a BLE zariadeniami (ak samotný hardvér podporuje BT)
  • Websocket - real-time komunikácia s podporou obojsmernej komunikácie, možnosť MQTT
  • WebRTC - pre UDP komunikáciu, vyžaduje signalizačný server
  • Server-Sent Events - jednosmerná komunikácia servera klientovi (musí bežať na ESP32)
  • a iné...

Ako teda vyplýva, niektoré typy umožňujú priamu komunikáciu, iné sprostredkovanú, teda cez prostredníka - server. V tomto prípade využijeme API, keďže dáta máme uložené v SQL, niekedy aj v noSQL databázach (MySQL, MariaDB, PostgreSQL, InfluxDB, MongoDB). Dotazom na API vlastnej webaplikácie z produkcie Your-IoT získame vždy posledné namerané dáta v JSON formáte, pričom dáta obsahujú aj časovú značku, ktorou je možné určiť, či je zariadenie aktívne, alebo dlhodobo offline. Pre samotné skenovanie QR kódu som využil Instascan HTML5 s ktorým mám len dobré skúsenosti už od QR skenera pre Watmonitor. Do rozhrania som doplnil aj výber kamier rovnako tak s možnosťou ovládania prísvitu LED diódy skrz WebRTC.

Samotný QR kód môže obsahovať rôzne dáta, avšak je možné využiť jednoduché cases, teda mať v QR kódoch uchované poradové čísla zariadení, napr. 1, 2, 3 ... pričom samotná webaplikácia vykoná konkrétnu akciu, ktorá je priradená číslu zariadenia. Sofistikovanejší spôsob je ale do QR kódu dať link, ktorý priamo vráti dáta, teda webaplikácia s AR scénou link priamo spustí pre získanie dát. Takto dokážete vytvoriť univerzálnu aplikáciu, ktorá môže čítané dáta priamo vyobraziť a použiť aj kľúče JSON dát pre vypísanie názvu parametra, teda hodnota 12.5 bude zrejmé, že je to Napätie betérie a nie len nejaké bezrozmerné náhodne číslo v éteri.

Vzorovo som si ale vytvoril v logike HTML programu a use cases dve zariadenia, pričom jedno nieslo QR kód s číslom 3 a druhé s číslom 4. V prípade čísla 3 išlo o ultrazvukový vodotesný snímač vzdialenosti v krabičke, ktorý nebol pripojený k riadiacemu hardvéru. Po naskenovaní QR kódu sa vykonal HTTPS GET na získanie JSON dát z webaplikácie Watmonitor (dashboard hladinomera) a došlo k ich vypísaniu na plane.

Obdobne pre zariadenie, ktoré nesie číslo 4 sa vykoná HTTPS GET pre dosiahnutie posledných nameraných dát u LoRa vysielača, ktorý sníma napätie 12V batérie. Samotný QR kód bol umiestnený na LoRa prijímači. Dáta boli priamo z Batmonitora, kde sú štandardne vizualizované aj v grafickej vizualizácii s ApexCharts. Ako môžeme vidieť, dáta v AR scéne sa plne zhodujú s tým, čo je vo webovej vizualizácii Batmonitora v tabuľke, i grafe.

S objektom, resp. scénou je možné na smartfóne otáčať rotáciou telefónu, alebo držaním a ťahaním po obrazovke telefónu. Objekt je vo fixnej vzdialenosti od kamery, nezostáva na originálnom mieste. Je to typ vizualizácie, ktorú nazývame aj.view-locked. Teda aj počas pohybu používateľ ho pred sebou zreteľne vidí. Ak by objekt ostal na určitom mieste v priestore, nazvali by sme ju world-anchored. Na taký typ vizualizáciu by už bolo potrebné zvoliť podpornú AR knižnicu (WebXR / MindAR), keďže A-frame to sám o sebe neumožňuje. Rovnako tak by bolo zložité navrhnúť vizualizáciu v priestore tak, aby bol dashboard čitateľný, pretože by použivateľ musel stále prejsť pred zariadenie, alebo by bolo nutné urobiť vizualizáciu tak, že by text obiehal dookola napr. valec a používateľ dáta videl zo všetkých uhlov.

Ako to prebieha priamo na telefóne? Pozrime si... Najprv s offline zariadením a potom s online zariadením, kde máme aj aktuálne dáta. AR scéna je dynamická, vo videu to kazí zrejme framerate kamery. Pohyb v AR scéne je plynulý a nie je trhaný.

 

Kto môže využiť takúto AR vizualizáciu a kde nájde praktické uplatnenie?

  • Priemysel a výroba: V rozsiahlych výrobných halách alebo technologických prevádzkach je bežné, že rôzne zariadenia a senzory sú rozmiestnené po celom areáli. Pomocou QR kódu pripevneného na zariadení si pracovník (napr. technik údržby alebo operátor) dokáže okamžite zobraziť aktuálne údaje zo senzora priamo v AR priestore, napríklad teplotu chladiaceho média, otáčky motora, alebo stav výrobnej linky aj s identifikáciou poruchy s konkrétnym chybovým kódom. Svojim zásahom nemusí ani ovplyvniť beh linky, nepotrebuje ani prístup k počítaču stroja
  • Energetika a údržba záložných systémov: V prípade monitorovania UPS staníc, záložných batérií či fotovoltaických zariadení, AR vizualizácia umožňuje rýchlu diagnostiku – napríklad stav nabitia batérií, napätie alebo aktuálnu výrobu a spotrebu. Servisný technik vie jedným pohľadom (po naskenovaní QR) zistiť, či niektorý z prvkov nie je pod, alebo nad limitnými hodnotami.
  • Smart City riešenia a mestská infraštruktúra: Senzory rozmiestnené v rámci mesta (meteostanice, monitoring hluku, CO₂, kvality ovzdušia, osvetlenia) môžu byť identifikované QR kódom a cez AR vizualizáciu môže mestský pracovník získať okamžitý prehľad o aktuálnych stavoch bez nutnosti vyťahovať notebook alebo spúšťať samostatnú aplikáciu. V prípade osvetlenia môže získať aj doplnkové informácie o vykonanej revízii
  • Skladové hospodárstvo a logistika: Na regáloch alebo škatuliach môže byť QR kód, ktorý pri naskenovaní zobrazí napr. počet zostávajúcich kusov, váhu, dátum posledného vyskladnenia či čiarové kódy z integrovaného systému. Vďaka tomu pracovník nemusí manuálne vyhľadávať položku v ERP systéme.
  • Vzdelávanie: Študenti môžu získať okamžitý prehľad o funkcii senzorov alebo zariadení. Napr. pri výučbe IoT alebo elektrotechniky – po naskenovaní QR kódu sa v AR scéne zobrazí názorný popis, schéma zapojenia a aktuálne dáta z experimentu, ktorý beží online.
  • Poľnohospodárstvo a environmental monitoring: Na farmách, v skleníkoch alebo vinohradoch môžu byť senzory pôdnej vlhkosti, teploty alebo úrovne zavlažovania. V teréne je vďaka AR vizualizácii možné veľmi rýchlo získať aktuálny stav a upraviť nastavenia priamo podľa potreby.
  • Stavebníctvo a facility management: Na stavbách alebo v prevádzkovaných budovách je možné priamo na mieste kontrolovať funkciu senzorov (napr. CO₂ senzory, pohybové čidlá, hlásiče požiaru). QR kód nalepený pri zariadení zobrazí napr. čas poslednej revízie alebo stav batérie v zariadení.

Takáto forma AR vizualizácie je výhodná najmä preto, že:

  • Nevyžaduje inštaláciu aplikácii, všetko beží cez web
  • Vždy aktuálne dáta s rýchlym prístupom k nim
  • Okamžite použiteľné
  • Kompatibilné s akýmkoľvek smartfónom s kamerou
  • Možnosť kombinácie rôznych zariadení do jednotného spôsobu vizualizácie


Iné projekty z portfólia Your-IoT nájdete na: https://your-iot.github.io/portfolio.html

 



Prístupov 373
Kvalita článku
hlasov 0

PRÍSPEVKY
SLEDUJETE
Prosím prihláste sa pre možnosť pridania komentáru.
Prihláste sa, alebo použite facebook login facebook login
ĎALŠIE ČLÁNKY V BLOGU
Výmena karburátora Homelite ST-155
[ 30.7.2025] (príspevkov 0)
AR plane pre IoT zariadenia
[ 30.7.2025] (príspevkov 0)
Začiatky s AR / VR pre web
[ 23.7.2025] (príspevkov 0)
NASA API cez Python, APoD, pozadie Windo...
[ 12.7.2025] (príspevkov 0)
Tlačidlový DOMINATOR - prestavba z RFID ...
[ 28.6.2025] (príspevkov 0)
Šifrovanie LoRa payloadu prakticky
[ 23.6.2025] (príspevkov 0)
Šifrovanie LoRa payloadu
[ 18.6.2025] (príspevkov 0)
Monitorovanie napätia 12V batérie
[ 9.5.2025] (príspevkov 0)
Recenzia YATO YT-8272
[ 16.4.2025] (príspevkov 0)