WebVisu visualizzazione da browser di pagine in HTML5

  1. Home
  2. Knowledge Base
  3. Controllori SlimLine Raspberry
  4. Programmazione CODESYS
  5. WebVisu visualizzazione da browser di pagine in HTML5

Con WebVisu puoi realizzare la tua interfaccia uomo macchina (HMI) direttamente integrata nel programa PLC, l'estensione WebVisu in ambiente CODESYS permette di realizzare pagine sinottiche visualizzabili da un qualsiasi browser. Le pagine sono realizzate nell'ambiente di sviluppo CODESYS all'interno del progetto PLC di cui sono parte integrante e con il quale condividono le variabili.

Le pagine sono memorizzate nel file system dello SlimLine, per accedervi basterà dal browser digitare l'indirizzo IP dello SlimLine seguito dalla porta 8080 (Esempio http://192.168.0.122:8080). La gestione in javascript esegue il rinfresco automatico degli oggetti che cambieranno valore/forma in relazione al valore delle variabili di programma PLC a cui sono riferite.

A titolo dimostrativo viene fornito con il PTP161 (Download) il progetto WebVisuStartUp che tramite una semplicissima interfaccia grafica dimostra come sviluppare applicazioni con WebVisu.

Il programma PLC in PLC_PRG esegue:

  • Lampeggio della variabile Blinker.
  • AND logico tra la variabile Blinker e ANDInp.
  • Acquisizione analogica 0-10 Volt con FB SysGetAnInp.
  • Gestione uscita analogica 0-10 Volt con FB SysSetAnOut.

Nella pagina grafica sono presenti lampade di segnalazione stato, pulsante di attivazione comandi, gauge di visualizzazione valore analogico in ingresso e potenziometro di impostazione valore analogico in uscita.

I vari oggetti sono connessi alle variabili del programma, come  si vede dalla immagine la lampada gialla è connessa alla variabile Blinker del programma PLC_PRG e così per tutti gli altri oggetti. Trasferendo il programma su di un sistema SlimLine con un modulo di estensione mixed I/O ne vedremo il funzionamento in pratica.

Ecco a lato la pagina visualizzata da Chrome, agendo sul pulsante si abilita tramite l'operando AND il passaggio dello stato di Blinker in uscita e avremo il lampeggio della lampada verde in sincronia con quello della lampada gialla.

Variando la tensione in ingresso al modulo analogico ne verrà riportato il valore sullo strumento a lancetta.

Agendo sul potenziometro andremo a variare la tensione sulla uscita analogica il cui valore viene visualizzato sullo strumento a barra a lato del potenziometro.

Ti è stato utile questo articolo ?

Ultimo aggiornamento: 23 Dicembre 2019