Antennino su dashboard THINGSBOARD

Costruiamo la Dashboard per gestire in maniera ottimale la nostra rete di dispositivi IoT Antennino connessa tramite il modulo Gateway dedicato.

Dopo avervi descritto il gateway hardware per i moduli Antennino ed averlo abbinato a una Dashboard basata sul software ThingsBoard, con la quale governare una rete per l’IoT, in questo articolo entreremo nel vivo della gestione del Gateway Antennino realizzando una Dashboard personalizzata.

Ancora una volta passeremo da ThingsBoard, con il quale costruiremo passo dopo passo la Dashboard per gestire i dati telemetrici provenienti dai nodi sensore Antennino.

Visualizzeremo quindi temperatura, luminosità, tensione della batteria, livello del segnale su dei Widget analogici e su dei grafici.

Spiegheremo anche come controllare, tramite ThingsBoard, un LED presente sui moduli Antennino usando quella che viene indicato con l’acronimo RPC (Remote Procedure Call). Realizzeremo delle Dashboard di test e vedremo anche come velocizzarne la realizzazione adottando un approccio più professionale.

Spiegheremo inoltre come implementare il backup delle configurazioni della nostra Dashboard.

Configuriamo il Gateway Antennino

Se stiamo utilizzando la versione live di ThingsBoard dovremo autenticarci inserendo le credenziali che abbiamo fornito in fase di registrazione. Altrimenti dovremo accedere al nostro server ThingsBoard privato sulla porta 8080, raggiungibile all’indirizzo: https://xxx.xxx.xxx.xxx:8080.

Vediamo quindi come aggiungere il nostro Gateway Antennino alla configurazione.

Andiamo nella voce di menu Dispositivi (Fig. 1), individuiamo il pulsante arancione con il simbolo + nell’angolo inferiore destro del pannello, ed aggiungiamo un dispositivo nominandolo “Gateway Antennino”. La cosa importante è spuntare l’opzione: “È un Gateway”.

 

Fig. 1 Aggiunta del modulo Gateway Antennino.

 

Gli altri dispositivi presenti li possiamo mantenere: potrebbero esserci utili per sperimentare con i tutorial forniti dal sito ThingsBoard.

Una volta inserito il Gateway, riapriamo la lista dei dispositivi e facciamo doppio clic su quello, tra i presenti in elenco, appena inserito, quindi clicchiamo sulla voce “Copia Token di Accesso”.

Questo permette di salvare nel blocco note la chiave di accesso del dispositivo Gateway, un valore di esempio, potrebbe essere: eOlO3RjnhSBs6rrzkSOx.

Questo Token deve essere usato più avanti nella configurazione del nostro Gateway per autenticarsi su ThingsBoard; attenzione che si tratta di un dato riservato che non va assolutamente divulgato.

La successiva operazione da compiere è di assegnare all’utente “Customer A” il dispositivo Gateway Antennino.

Per fare questo selezioniamo dal menu a sinistra la voce Clienti e una volta individuato il Cliente interessato andiamo a cliccare su “Gestisci dispositivi clienti” (vedi Fig. 2) si aprirà una nuova finestra che ci elencherà i dispositivi presenti, clicchiamo sul pulsante inferiore destro con il segno + e selezioniamo dalla lista il dispositivo “Gateway Antennino” clicchiamo quindi su “Assegna”.

Questa operazione è molto importante perché permette di fare in modo che tutti i dispositivi RFM69 che saranno “intercettati” dal Gateway verranno automaticamente, non solo caricati nei dispositivi visibili su ThingsBoard, ma assegnati automaticamente al Customer A in virtù del fatto che il Customer A è assegnatario del Gateway Antennino (Fig. 2).

Se la lista dei clienti fosse vuota è sufficiente cliccare sul pulsante arancione in basso a destra ed aggiungere il cliente mancante.

Fig. 2 Assegnazione del Gateway al Customer A.

 

A questo punto, chiudiamo completamente eventuali browser aperti, poi alimentiamo il Gateway Antennino mentre ne teniamo premuto il pulsante (P1) allo scopo di resettare la configurazione WiFi presente a bordo della scheda. Attendiamo 30÷40 secondi, e verifichiamo se nella lista delle reti WiFi elencate sul nostro PC sia presente una rete che abbia il seguente SSID: TB-AntenninoGateway.

In caso affermativo possiamo procedere, altrimenti proviamo a togliere l’alimentazione al Gateway, attendere 10 secondi ricollegare l’alimentazione e verificare nuovamente la presenza del segnale AccessPoint del Gateway.

Nella fase di configurazione, il nostro Gateway si comporta a tutti gli effetti come Access Point. Facciamo doppio clic sulla dicitura TB-AntenninoGateway (come se ci dovessimo collegare ad una reale rete WiFi) dopo qualche secondo si aprirà, nel Browser, la pagina di Fig. 3.

 

Fig. 3 WiFi Manager.

 

Clicchiamo sul pulsante “Configure WiFi”, si aprirà la pagina di configurazione del Gateway (Fig. 4).

Come prima cosa dobbiamo selezionare la rete WiFi alla quale il nostro gateway dovrà collegarsi per acquisire la connettività Internet; facciamo quindi clic sul nome della rete alla quale vogliamo collegarci, inseriamo la relativa password e poi dovremo immettere l’indirizzo IP del server ThingsBoard sul quale ospiteremo la nostra Dashboard e il “TB Token” di accesso che abbiamo copiato precedentemente durante l’impostazione del Gateway su ThingsBoard.

Nel caso venga utilizzato il server Demo Live http://demo.thingsboard.io, il suo IP = 104.196.24.70.

 

Fig. 4 Configurazioni Gateway.

 

Quindi potremmo usare questo indirizzo, ma è meglio lasciare vuoto il campo “mqtt server” e valorizzare “mqtt server name” con “demo.thingsboard.io”; sarà poi il nostro gateway a risolvere il valore in un indirizzo IP. In questo caso deve essere valorizzato il campo username con il Token di accesso e lasciare vuota la password.

Il valore del parametro “MQTT port” deve essere 1883 (valore canonico della porta di un Broker Mqtt).

È necessario valorizzare anche il campo del “timezonedb_key” relativo al servizio TimeZonedB, per la sincronizzazione del RTC a bordo della scheda. Ricordiamo che per usufruire del servizio di sincronizzazione è necessario registrarsi sul sito: https://timezonedb.com.

Una volta registrati andare su Account Overview e copiare la propria API Key Terminata la configurazione possiamo cliccare su “Salva”.

La pagina verrà sostituita con una pagina che confermerà il corretto salvataggio dei dati.

Se tutto avrà funzionato a dovere, il nostro Gateway dovrebbe aver acquisito la configurazione ed averla salvata sul Filesytem SPIFFS interno al modulo ESP32 ed al prossimo riavvio utilizzerà tale configurazione per acquisire l’accesso ad Internet ed i dati di accesso al nostro personale server ThingsBoard. Andiamo ora a verificare se i dispositivi Antennino vengono visualizzati.

Apriamo quindi dal menu di sinistra la voce “Dispositivi”.

Dopo qualche minuto dovremmo trovare dei nuovi dispositivi nella lista: RFM69_1 e RFM69_2 … RFM69_XX.

Per ulteriore conferma andiamo a vedere quali sono i dispositivi che sono attribuiti al nostro Customer A.

Per fare questo torniamo nella lista dei clienti e, trovato il “Customer A”, andiamo ad ispezionare “Gestisci dispositivi Cliente”: dovremmo Trovare la lista dei dispositivi RFM69 Associati al Customer A.

Realizziamo la prima Dashboard

Ora che abbiamo i nostri due dispositivi RFM69 presenti su ThingsBoard, passiamo a visualizzare i dati telemetrici inviati dai dispositivi stessi; allo scopo facciamo doppio clic su uno dei due dispositivi RFM69 e poi apriamo il Tab (Fig. 5) con la dicitura “LAST TELEMETRY”.

Se teniamo aperto questo Tab e lasciamo alimentati i dispositivi ed il gateway, vedremo avvicendarsi i valori dei dati telemetrici con una frequenza di aggiornamento circa 5 secondi.

 

Fig. 5 Dati telemetrici ricevuti dal Nodo RFM69_1.

 

Bene, ora che abbiamo i dati, cosa ci facciamo? Le risposte a questa domanda sono moltissime, quindi limitiamoci a ciò che attiene i dati basilari: per esempio possiamo visualizzare i dati ricevuti dai nostri dispositivi in diversi modi, utilizzando quelli che vengono indicati come Widget, da posizionare su una specifica Dashboard.

Vediamo il modo più immediato di farlo: selezioniamo, per esempio, il checkbox relativo al dato telemetrico Luminosità (L); appena selezionato appare la scritta “SHOW ON WIDGET” (Fig. 6) cliccando sulla quale abbiamo la possibilità di selezionare una certa famiglia di Widget (Fig. 7); selezioniamo quindi la Tipologia “Analog Widget” e poi sfogliamo quelli disponibili, soffermandoci su quello visibile nella Fig. 8.

A questo punto clicchiamo sul pulsante “ADD TO DASHBOARD”, inseriamo le eventuali opzioni e clicchiamo su “ADD”. Aprendo la Dashboard appena creata vedremo il risultato finale.

Se cambiamo la condizione di illuminazione del sensore LDR presente sul RFM69_1 vedremo che l’indicatore analogico si adeguerà.

Fig. 6 Selezione del dato telematico.

 

Fig. 7 Selezione del Widget da usare.

 

 Fig. 8 Widget Analogico.

 

Bene, abbiamo realizzato la nostra prima Dashboard! Ad essa possono essere aggiunti altri Widget, Widget che visualizzano dati provenienti da altri dispositivi oppure dati telemetrici relativi allo stesso dispositivo; per fare questo, è sufficiente cliccare sul pulsante arancione con l’icona di una matita, presente in basso a destra.

Con tale azione avremo la possibilità di editare la dashboard, eliminare il Widget corrente, aggiungerne altri, oppure editare i singoli Widget.

È possibile editare per esempio il Widget per modificarne la didascalia, i colori dei testi, le dimensioni e tanto altro.

Per il momento vediamo come aggiungere un Widget alla Dashboard: clicchiamo quindi sul pulsante con il simbolo + e poi sul pulsante con l’icona di un foglio, ciò ci permette appunto di creare ed aggiungere un nuovo Widget alla Dashboard corrente. Selezioniamo anche in questo caso un indicatore analogico ed in particolare quello che ha il simbolo dei °C.

Appena clicchiamo sul Widget ci verrà proposto di definire da quale sorgente dati (dispositivo) dobbiamo attingere per i dati da visualizzare; ci viene ricordato anche che è possibile usare una sola sorgente dati.

Digitiamo quindi il Nome “RFM69_1” nel campo “Alias Entity” poi clicchiamo su “serie temporale” (Fig. 9 e Fig. 10) e ci apparirà la lista di tutte le tipologie di dati telemetrici misurati dal Sensore RFM69_1; in questa sezione selezioniamo la serie temporale T.

Anche qui ci viene ricordato che è possibile utilizzare una sola serie temporale. Al termine clicchiamo su “ADD” e il nuovo Widget andrà ad aggiungersi alla nostra Dashboard (Fig. 11).

Possiamo ripetere la procedura per visualizzare nella Dashboard anche il livello del segnale RSS e la carica della batteria BAT. Naturalmente siamo liberi di usare altre tipologie di Widget.

 

Fig. 9 Assegnazione sorgente dati.

 

Fig. 10 Selezione della serie temporale.

 

Fig. 11 Dashboard che visualizza Luminosità e Temperatura.

Semplifichiamo la gestione

La Dashboard che abbiamo abbozzato visualizzerà i dati di un singolo dispositivo Antennino.

Immaginiamo di avere decine se non centinaia di sensori che inviano dati telemetrici verso la nostra dashboard ThingsBoard e di dover ripetere per ognuno dei dispositivi la procedura appena descritta; sarebbe veramente tedioso ripetere i vari step per ogni sensore. Inoltre, mantenere allineate tutte le Dashboard sarebbe un compito veramente ingrato e soggetto ad errori di editazione.

Supponiamo inoltre di aver sviluppato il sistema per un cliente, il quale ci chiede di voler cambiare il tipo di Widget usato per visualizzare i dati telemetrici della temperatura di tutti i sensori, invece di un indicatore circolare, ora desidera un indicatore lineare.

Bene, dovremmo editare la Dashboard di tutti i vari sensori uno ad uno. Un vero delirio! Ma ThingsBoard ha la soluzione adatta per noi.

È possibile utilizzare una particolare tipologia di Widget che elenca in forma tabellare tutti i dispositivi. Quando aggiungeremo un nuovo dispositivo alla rete, questo si visualizzerà automaticamente nella tabella.

Cliccando su una riga della tabella sarà possibile aprire un’altra Dashboard che potremo editare a nostro piacere, la quale visualizzerà i dati telemetrici del dispositivo che abbiamo selezionato.

Quindi dovremo realizzare una sola Dashboard che visualizzerà in modo uniforme i dati di tutti i dispositivi. Le eventuali richieste di modifica del nostro cliente ora potranno essere accolte ed esaudite con un paio di clic.

Vediamo come gestire questa tipologia di Dashboard: creiamo una nuova Dashboard, nominiamola per esempio “DeviceList” ed andiamo ad aggiungere degli Alias cliccando sul pulsante indicato dalla freccia in Fig. 12.

Apriamo ora una piccola parentesi sugli Alias, i quali sono dei “Segnaposto” per indicare degli aggregati di dispositivi: per esempio una serie di dispositivi che soddisfano un certo criterio e che possono essere usati per visualizzare dei dati. Il primo alias che andremo a creare lo indicheremo con “AntenninoDevices”; la creazione si effettua mediante la finestra di dialogo Add alias visibile nella Fig. 13.

È quindi evidente che questo Alias in pratica rappresenta tutti i dispositivi RFM69 che fanno parte della nostra rete.

Poi andiamo a creare un altro Alias che indichiamo come “CurrentDevice”; questo Alias, invece, impersona il dispositivo corrente che andremo a selezionare quando cliccheremo su una riga della tabella.

 

Fig. 12 Configurazione lista dispositivi.

 

Fig. 13 Assegnazione Alias.

 

Al termine ci troveremo in una situazione come quella in Fig. 14.

Clicchiamo sul pulsane “SAVE”; gli Alias visibili nella finestra li useremo nei Widget che andremo ad inserire; aggiungiamo un Widget della tipologia “Cards”, selezioniamo il Tab “LATEST VALUE” e appena avremo cliccato sul Widget apparirà la maschera riportante la richiesta di definire la sorgente dati.

Inseriamo come Entity alias “AntenninoDevices”, poi clicchiamo su Timeseries per selezionare i dati da visualizzare nella tabella. Sarebbe sufficiente uno solo dato, ma approfittiamo della vista tabellare per avere un quadro di insieme dei dati che provengono dai sensori.

Fig. 14 Gli Alias configurati.

 

Ora apriamo la Tab “ACTIONS” nella quale, cliccando sul pulsante + per aggiungere un’azione, si apre la scheda proposta nella Fig. 15 nella quale selezioniamo “On row clic” su Action source, inseriremo “getDetails” in Name, selezioniamo “Navigate to new dashboard state” in Type, e spuntiamo “Set entity from Widget” per poi cliccare su “ADD”.

Ora clicchiamo sull’icona “Manage Dashboard State” e nella finestra di dialogo che si apre andiamo ad aggiungere le due righe presenti in Fig. 16, cliccando sul pulsante + e compilando la relativa maschera di inserimento; al termine clicchiamo su “SAVE”.

 

Fig. 15 Assegnazione evento.

 

Fig. 16 Impostazione dei Dasboard states.

 

Ora andiamo a definire la Dashboard che verrà visualizzata quando cliccheremo su una riga della tabella: allo scopo clicchiamo sul selettore indicato dalla freccia in Fig. 17, il che aprirà una nuova Dashboard “nodedetail” dove andiamo ad inserire per esempio un indicatore analogico come fatto negli esempi precedenti.

Selezionato il Widget, dobbiamo definire la sorgente dati: come Entity alias selezioniamo “CurrentDevice” e poi dobbiamo definire la TimeSeries.

Notate che nella relativa sezione non avremo il completamento automatico cliccando sulla dicitura; allora scriviamo T, verrà visualizzata la scritta ‘T’ not found, create new one: clicchiamo su ‘create new on’ oppure Invio, poi completiamo la definizione dei dati del Widget cliccando su “ADD”, al termine avremo la Dashboard di Fig. 18 contenente il Widget creato.

Facciamo quindi clic sul pulsante arancione in basso a destra riportante il segno di spunta “Apply changes” per applicare le modifiche introdotte.

Ora possiamo saggiare la praticità di quello che abbiamo implementato: la finestra principale di ThingsBoard riporta la tabella con la lista di tutti i dispositivi RFM69 che abbiamo nella nostra rete e viene visualizzato lo stato live dei dati telemetrici corrispondenti.

Se clicchiamo in un qualunque punto di una riga, passeremo immediatamente a visualizzare la Dashboard relativa al dispositivo corrispondente. Da notare che cliccando sulla voce “DeviceList” ritorneremo alla visualizzazione tabellare.

 

Fig. 17 Avvio della creazione della Dashboard.

 

Fig. 18 Dashboard contenente un solo Widget del tipo strumento a lancetta.

 

Custom Widget

Abbiamo sviluppato dei Widget per interfacciarsi con i moduli Antennino, uno di questi è CUSTOM GPIO quindi apriamo la cartella dei Widget, clicchiamo sul pulsante con il + per aggiungere un Widget e poi sulla icona con la freccia verso l’alto “Import Widget Bundle” e quando si apre la finestra di importazione selezioniamo il file custom_gpio.json dalla cartella che avrete scaricato del nostro repository Github.

Terminata l’importazione avremo un nuovo Widget nel nostro “Arsenale” denominato “Custom GPIO”. Lo scopo del Widget che abbiamo appena inserito è quello di permettere il controllo remoto di PIN GPIO sul nostro modulo Antennino.

Nel nostro caso andremo a controllare il pin del LED (PIN9) a bordo del modulo, ma nessuno vi vieta di modificare il codice per controllare un altro pin collegato per esempio ad un relé.

Procediamo quindi nell’inserimento del Widget nella Dashboard che abbiamo realizzato nell’ultimo esempio.

Apriamo la sezione relativa alle Dashboard, facciamo doppio clic sulla Dashboard “DeviceList” ed entriamo in modalità editing. A questo punto clicchiamo sul selettore in alto a sinistra e selezioniamo la voce “nodedetail” in questo modo andremo ad editare la Dashboard di dettaglio.

Andremo quindi ad aggiungere un Widget del tipo “Custom GPIO” cliccando sul pulsante + e poi su “create new Widget”, al termine avremo una situazione del tipo di Fig. 19.

 

Fig. 19 Aggiunta del widget GPIO.

 

Facciamo doppio clic sul Widget proposto e ci verrà richiesto (come di consueto) di specificare la fonte dati. Indichiamo “CurrentDevice” come Fonte dati, poi spostiamoci sul Tab “ADVANCED” dove dovremo lasciare solo un pin GPIO ed il pin deve essere il 9. Clicchiamo su “ADD” per aggiungere il Widget appena configurato alla Dashboard; al termine, la nostra Dasboard si sarà arricchita del controllo GIO.

Andiamo ora a completare la Dashboard NodeDetail con altri Widget. Aggiungiamo la visualizzazione tramite “Analog Gauge” del livello della batteria, e della luminosità e poi inseriremo anche dei grafici per visualizzare l’andamento nel tempo dei parametri.

I Widget sono altamente personalizzabili, nel caso dell’indicatore analogico del livello della batteria sarà possibile a definire il valore minimo e massimo ed anche le didascalie con valore minimo, massimo e medio.

Dopo aver inserito i Widget, rimanendo in modalità editing spostiamo i Widget nel modo che più ci aggrada: nel nostro caso, li abbiamo posizionati tutti su una riga per motivi di spazio, come viene mostrato nella Fig. 20.

Fig. 20 Widget disposti su un’unica riga.

 

Ultima cosa che ci rimane da fare è quella di aggiungere anche dei Widget per visualizzare dei grafici temporali dei dati; entriamo quindi in modalità editing della nostra Dashboard ed inseriamo tre Widget del tipo “Chart” – “Timeseries float” (Fig. 21).

Anche qui, una volta selezionato il grafico dovremo definire la sorgente dati, la legenda, i limiti dei valori degli assi y.

Infine la Dashboard, dopo aver ripetuto l’inserimento per Temperatura, Luminosità e Batteria, si presenta completa come in Fig. 22.

Fig. 21 Inserimento del Widget grafico.

 

Fig. 22 Dashboard di dettaglio completa con più Widget.

 

Benissimo, ora siamo pronti a sperimentare in modo professionale!

Ripristino di una Dashboard da file di backup Json

Quando avrete terminato la realizzazione della Dashboard e vi sentirete soddisfatti, oppure quando ritenete di dover apportare delle modifiche corpose che potrebbero compromettere il funzionamento di quello che avete fatto fino a quel momento, è il caso di fare una pausa per un caffè ed eseguire un backup del vostro lavoro.

La procedura di backup è molto semplice. È sufficiente selezionare la lista delle Dashboard, individuare quella che deve essere salvata e poi cliccare sul pulsante con la freccia verso il basso “Export Dashboard”.

Questo permette di salvare la dashboard completa sotto forma di un file Json nel nostro PC. Per facilitarvi il compito abbiamo effettuato il backup delle configurazioni dei Widget e delle Dashboard.

Accedete quindi al progetto su Github e scaricate lo zip contenente i file necessari.

Una volta scompattata la cartella sul vostro PC, tra le tante cartelle, ne troverete una denominata ThingsBoard in cui sono presenti altre sottocartelle: Widget e Dashboard. All’interno di Dashboard troverete il file devicelist.json.

Il nostro suggerimento è quello di provare a creare da soli la Dashboard seguendo le indicazioni riportate nel paragrafo precedente, ma se proprio incontrate delle difficoltà potrete crearla ripristinandola dal vostro backup.

Anche in questo caso la procedura è molto semplice. Aprite la pagina relativa alle Dashboard e individuate il pulsante arancio con il simbolo del +: cliccandolo, si visualizzeranno altri due pulsanti; cliccate su quello superiore con la freccia verso l’alto e apparirà un box centrale (Fig. 23) dove vi verrà proposto di trascinare sulla zona tratteggiata oppure di fare doppio clic sulla stessa per importare il file json di una Dashboard preventivamente salvata.

Fig. 23 Ripistino di una Dashboard da file Json.

 

Individuate quindi il file devicelist.json nel vostro PC e cliccate sul pulsante “IMPORTA”. Se vi viene richiesto di configurare l’alias del Gateway, cliccate sul pulsante con la matita, allorché si aprirà la finestra proposta nella Fig. 24, nella quale andrete a compilare come indicato in figura e poi a salvare. Se tutto sarà andato a buon fine avrete la vostra Dashboard pronta per l’uso.

Fig. 24 Configurazione dell’alias del gateway.

Conclusioni

Bene, per il momento abbiamo terminato.

Prendete confidenza con ThingsBoard e se non vi fate intimorire dall’inglese, dedicate del tempo anche alla lettura delle guide presenti sul sito ufficiale.

Ci sono molte cose da imparare e sperimentare. Prossimamente spiegheremo come utilizzare ThingsBoard in un ambiente Multi-Tenant e Multi-Client; introdurremo gli attributi assegnabili agli oggetti di ThingsBoard e la gestione degli allarmi con un ulteriore Widget sviluppato da noi che ci permetterà di gestire le soglie di allarme dei singoli dispositivi in maniera grafica, senza dover scrivere del codice.

Vedremo anche come inviare delle notifiche push verso un dispositivo Android, oppure come inviare delle e-mail al verificarsi di una condizione di allarme.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato.

Menu