Heute gibt es den Nachtrag zum Beitrag Visualisierung. Der Wechsel des Hintergrundbildes und das Positionieren der Temperaturwerte abhängig vom Status (Sommerbypass) habe ich wie geplant in die Visualisierung der KWL eingebaut. So verändert sich das Bild wenn in der KWL der Sommerbypass aktiv ist.
Mit der Visualisierung unserer Alpha-InnoTec Wärmepumpe habe ich auch begonnen. Hier werden abhängig vom Status von z. B. Ventilen und Pumpen passende Symbole eingeblendet. So sieht die erste Version der Seite aus wenn die Wärmepumpe gerade Warmwasser produziert. Es fehlt zwar noch eine Menge an Ventilen und Umwälzpumpen aber die kommen dazu, sobald ich den Aufbau der Wärmepumpe komplett verstanden habe. Ich verstehe z. B. noch nicht ganz wieso während der Speicher aufgeladen wird zusätzlich zur Brauchwasserumwälzpumpe (BUP) die Heizungsumwälzpumpe (HUP) läuft?! Das Problem wird aber die noch nicht ganz passende Zeichnung sein.
Die PHP-Skripte (für KWL und Wärmepumpe) habe ich wieder im Download Bereich unter Visualisierung abgelegt. Es fehlen aber noch die anderen Hintergrundbilder von der Wärmepumpe. Diese füge ich aber noch irgendwann später hinzu.
KWL
Den Wechsel vom Hintergrundbild habe ich durch eine If-Abfrage realisiert.
Erstmal wird abgefragt ob der Bypass aktiv ist und der Wert (1 für aktiv und 0 für inaktiv) in die Variable $bypass geschrieben.
$bypass = simplexml_load_file('http://'. $Username .':'. $Password .'@'. $Miniserver .'/dev/sps/io/Bypass');
Über die verkürzte If-Abfrage (IF ? THEN : ELSE) wird die Variable $background gefüllt.
($bypass == 1) ? $background = 'kwl_mitbypass.gif' : $background = 'kwl_ohnebypass.gif';
Im CSS wird dann im body das background-image Element angepasst.
<style type="text/css">
<!--
Body
{
background-image:url("./pics/<?php echo $background; ?>");
...
Das Positionieren von Werten anhand vom Status habe ich auch über eine If-Abfrage realisiert. Hierfür muss zuerst wieder eine Variable (in diesem Beispiel $zuluft) mit Werten gefüllt werden.
($bypass == 1) ? $zuluft = '403' : $zuluft = '178';
Im CSS wird dann der Wert von $zuluft für die Positionierung genutzt.
#Zu
{
position: absolute;
top: 431px;
left: <?php echo $zuluft; ?>px; }
Jetzt wechselt der Wert Zuluft abhängig vom Wert Bypass (siehe die beiden Bilder der KWL Visu).
Wärmepumpe
Symbole positionieren funktioniert fast genauso wie mit Text. Erst mal ein einfaches Beispiel ohne If-Abfrage. Je nachdem ob der Status 0 oder 1 ist, wird das Bild 0.png oder 1.png angezeigt. In meinem Beispiel sind das die roten oder grünen Kreise.
<div id="BUP"> <?php $daten_BUP = $daten_raw[38]; echo '<p><img src="./pics/'. $daten_BUP .'.png"></p>'; ?> </div>
So könnte die If-Abfrage aussehen wenn die Bilder z. B. an.png und aus.png heißen.
<div id="BUP"> <?php ($daten_raw[38] == 1) ? $daten_BUP = 'an' : $daten_BUP = 'aus'; echo '<p><img src="./pics/'. $daten_BUP .'.png"></p>'; ?> </div>
Ob es noch einen dritten Teil geben wird, hängt davon ab ob mir (oder euch) noch was einfällt?! Vielleicht visualisiere ich noch die einzelnen Geschosse mit Informationen wie Bewegung, Fensterzustand, Temperatur, Luftfeuchte und Luftqualität aber die Funktionen werden voraussichtlich die gleichen bleiben.
NACHTRAG:
Natürlich kann man die Seite auch automatisch neu laden lassen. So würde sich alle 15 Sekunden die Seite neu laden.
<meta http-equiv="refresh" content="15" />
Ich habe die Zip Datei im Downloadbereich entsprechend angepasst.