Adattatori W&T per TCP/IP, Ethernet, RS-232, RS-485, USB, 20 mA Fibra ottica di vetro e di plastica, http, SNMP, OPC, I/O digitale, I/O analogico, ISA, PCI, ecc.?
La disponibilità capillare di Internet permette modi completamente nuovi nella visualizzazione dei valori di misura e dei dati di automazione. Mentre in precedenza tutti gli oggetti di una visualizzazione dovevano provenire dalla stessa fonte, oggi nella propria applicazione possono essere inseriti comodamente contenuti di fornitori terzi.
Nell’architettura Web2.0 questa tecnica viene definita mashup. Dati, immagini, audio e altri contenuti multimediali possono essere utilizzati nella propria pagina web mediante interfacce di programmazione API aperte.
Un esempio classico per questa tecnica è rappresentato dal servizio Google Maps. Mediante l’API di Google Maps è possibile integrare carte stradali o immagini satellitari da qualsiasi ubicazione nella propria pagina. Inoltre è possibile visualizzare all’interno di queste carte ad es. valori di misura.
Il seguente esempio intende mostrare nel dettaglio il modo in cui la temperatura misurata da un termografo web può essere integrata in una carta Google Maps.
Non disponete ancora di un termografo Web e desiderate semplicemente provarne il funzionamento come nell’esempio illustrato?
Nessun problema: vi mettiamo a disposizione gratuitamente per 30 giorni il termografo web NTC. Non dovete far altro che compilare l’ordinazione del campione e vi forniremo il termografo web in prova in conto aperto. Se ci restituite l’apparecchio entro 30 giorni, vi accreditiamo completamente la fattura.
e assegnato un indirizzo IP: con WuTility è facile!
1. Struttura di base HTML della pagina web
Per semplificare, la pagina web in questo esempio deve riportare come contenuto solo il particolare della carta e la visualizzazione della temperatura. A tale scopo nell’area Body della pagina viene creato un div layer con l’ID map. Mediante questo ID il contenuto del div layer può essere riempito, dopo avere richiamato la pagina web, con i dati della carta di Google Maps.
Un requisito di base per l’utilizzo dei servizi Google Maps è la registrazione in Google. Deve essere registrato il dominio web attraverso il quale si intende visualizzare il materiale della carta (nel nostro esempio ad es. www.WuT.de). La registrazione avviene mediante il seguente link: http://code.google.com/apis/maps/index.html.
In cambio si riceve un codice di accesso che, mediante il richiamo di un corrispondente script, rende accessibile l’API di Google.
3. Lo script PHP per richiamare la temperatura dal termografo web
Lo script qui visualizzato deve poter essere richiamato come file PHP proprio sullo stesso server PHP da cui può anche essere caricata la pagina web. Ha una struttura estremamente universale e può essere utilizzato ugualmente per la comunicazione con termografi web che con Web-IO. All’occorrenza lo script viene richiamato dal browser mediante una richiesta AJAX. Durante questa operazione vengono forniti attraverso l’URL tutti i parametri necessari:
IP
:
indirizzo IP del Web-IO
PORT
:
porta TCP del Web-IO (modo normale 80)
COMMAND
:
possibili comandi per i termografi web sono: single: al comando vero e proprio può seguire anche il numero del sensore
possibili comandi per Web-IO digitali sono: output, input o counter, dove al comando vero e proprio può seguire anche il numero dell’input o dell’output. Il Web-IO restituisce lo stato degli input o degli output.
Come ulteriore comando gli output possono essere impostati con outputaccess
PW
:
password amministratore od operatore del Web-IO (solo Web-IO digitale)
MASK
:
indica con scrittura esadecimale gli output che devono essere impostati (solo Web-IO digitale con outputaccess)
STATE
:
indica con scrittura esadecimale in quale stato gli output devono essere impostati (solo Web-IO digitale con outputaccess)
Il richiamo per l’interrogazione della temperatura si presenterebbe quindi in questo modo:
webiorequest.php?IP=URL des Web-Thermographen&PORT=80&COMMAND=single&
Come risposta lo script restituisce l’indirizzo IP, il nome dell’apparecchio e la temperatura corrente separati mediante punto e virgola:
Questo script viene memorizzato sul server sotto webiorequest.php.
4. Composizione e visualizzazione dei dati della temperatura e della carta
Il richiamo dei dati necessari della temperatura e della carta viene controllato da uno JavaScript mediante tecnica AJAX.
Con il caricamento della pagina web viene richiamata attraverso una corrispondente istruzione nel TAG body la funzione Load. Questa a sua volta carica la funzione DataRequest e trasferisce la stringa di comando che è necessaria per richiamare la temperatura.
La funzione DataRequest verifica innanzitutto quale browser sta alla base per utilizzare il metodo giusto per la HTTPRequest (qui ci sono differenze tra i browser compatibili con Internet Explorer o Firefox).
Attraverso lo script PHP descritto al punto 3 viene quindi richiamata la temperatura corrente. Alla ricezione della risposta viene richiamata automaticamente la funzione DataReceived incorporata.
Il valore della temperatura viene tagliato dalla stringa di ricezione e viene memorizzato di nuovo in una stringa assieme all’orario corrente.
Solo ora viene generata la carta. A tale scopo viene stabilita per l’ubicazione desiderata la corrispondente coppia di coordinate nella variabile point e viene aggiunta la carta desiderata nel div layer prestabilito.
L’aspetto della carta può essere prestabilito mediante diversi parametri (carta o immagine satellitare, elemento di comando per la navigazione ecc.).
Infine viene inserito un segnaposto nel punto corrispondente e la stringa con temperatura e orario viene collocata sulla carta.
<script type="text/javascript">
var map;
var point;
var marker;
var commandstring ='webiorequest.php?IP=klima.wut.de&PORT=80&COMMAND=single&';
function load()
{ DataRequest(commandstring);
}
function DataRequest(SendString)
{ var xmlHttp;
try
{ // Internet Explorer
if( window.ActiveXObject )
{ xmlHttp = new ActiveXObject( "Microsoft.XMLHTTP"
);
}
// Mozilla, Opera und Safari
else if(window.XMLHttpRequest )
{ xmlHttp = new XMLHttpRequest();
}
}
// loading of xmlhttp object failed
catch( excNotLoadable )
{ xmlHttp = false;
alert("no knowen browser");
}
if (xmlHttp)
{ xmlHttp.onreadystatechange = DataReceived;
xmlHttp.open("GET", SendString,
true);
xmlHttp.setRequestHeader("Cache-Control",
"no-store, no-cache, must-revalidate");
xmlHttp.setRequestHeader("Expires",
"Sat, 05 Nov 2005 00:00:00 GMT");
xmlHttp.setRequestHeader("Pragma","no-cache");
xmlHttp.send(null);
}
function DataReceived()
{ var Timenow = new Date();
if (xmlHttp.readyState == 4)
{ if (xmlHttp.status == 200)
{ var receivestring = xmlHttp.responseText;
var receivestringpart
= receivestring.split(';');
receivestring =
'Außentemperatur um '
+ Timenow.getHours()
+ ':'
+ Timenow.getMinutes()
+ ' Uhr '
+ receivestringpart[2].substring(0,receivestringpart[2].length-2)
+ '°C';
if( GBrowserIsCompatible()
)
{ point = new GLatLng(
51.305099, 7.254627 );
map
= new GMap2( document.getElementById( 'map' ) );
map.addControl(
new GSmallMapControl() );
map.setCenter(
point, 18 );
map.setMapType(G_SATELLITE_MAP)
marker
= new GMarker(point);
map.addOverlay(marker);
var
content = "<h3>Prima Klima bei W&T</h3>";
content
+= "<br><a href='http://klima.wut.de'>" +
receivestring + "</a>";
marker.openInfoWindowHtml(content);
}
}
}
}
} </script>
L’esempio supporta volutamente solo alcune funzioni di base della tecnica mashup ed è ottimizzato per il termografo web 57609 o 57610. Per gli altri modelli di Web-IO devono essere eventualmente apportati adattamenti alla pagina web d’esempio. Anche l’API di Google Maps offre numerose altre funzioni che qui non vengono utilizzate.
Attenzione: nell’esempio messo a disposizione qui per il download deve essere inserito il codice di registrazione adatto al dominio.