Hallo,
ich stelle den Füllstand meiner Regenwasserzisterne in einem horizontalen Balken (prozent) dar. Hat von euch jemand eine optisch schickere Lösung grafisch den Füllstand der Zisterne darzustellen realisiert?
Gruß
hardlog
Hallo,
ich stelle den Füllstand meiner Regenwasserzisterne in einem horizontalen Balken (prozent) dar. Hat von euch jemand eine optisch schickere Lösung grafisch den Füllstand der Zisterne darzustellen realisiert?
Gruß
hardlog
So,
hab mal nen wenig gebastelt. Ist nur der erste Versuch: Ist nen einfaches html-Script, das die Zisterne als Hintergrundbild in einer Tabelle darstellt und die Füllung wird als zweites Bild überlagert und entsprechend dem Füllungsstand in Prozent gestaucht angezeigt. Nicht sonderlich pfiffig und ein wenig hingebastelt aber es geht. Meine Zisterne ist rund/oval, auf die Art geht es aber nur als Rechteck. Erster Entwurf halt…
Gruß
hardlog
Find ich schon super. Da bin ich auf Deine nächsten Versuche gespannt.
Würde gern abkupfern.
Gruß Helmut
Sieht doch beides nicht schlecht aus.
Bleib da dran, bin gespannt wie das noch wird. Denn im Prinzip geht das ja für mehr Sachen:
-Briefkasten
-Puffer-Temperaturen
usw
Hallo hardlog,
wenn du einen ovalen <div> mit border-radius erstellst und den overflow:hidden setzt,
dann kannst du eine rechteckiges Bild in eine ovale Form legen.
Hoffe es hilft
Gruß soundman33
Schön, dass es auf Interesse stößt.
Hier die Anleitung:
(1) Stringvariable mit Profil ~htmlBox anlegen
(2) dardrunter ein script mit folgendem Inhalt
<?
$fuellung=GetValue(12345); // prozentuale Füllung, falls z.B. in Litern, muss es hier umgerechnet werden
$html="
<table border='0' cellpadding='0' cellspacing='0' widht='150' frame='void'>
<tr>
<td height=186 width=150 align='center' style='background-image:url(/user/zisterneoben.gif);' valign='bottom'>
<img src='/user/wasser.gif' width='128px' height='".$fuellung*0.62."%'>
</td>
<td valign='top'><font size='+2'>***Füllung: ".$fuellung." %</td>
</tr>
<tr>
<td height=12 width=150 align='left' style='background-image:url(/user/zisterneunten.gif);'>
</tr>
</table>
";
setvalue(38311,$html); // ID der unter (1) angelegten String-Variable
?>
(3) die zwei gif-Bilder der Zisterne und das gif des Wassers müssen im Verzeichniss ip-symcon/webfront/user liegen
Hatte gerade Probleme die Gifs zu posten. Daher hier die entsprechenden Dateien…
…oder das ganze per one-Click exportieren/importieren
Script im Anhang ist ein Install-Script (mit dem Project Exporter generiert) und legt alle Objekte und Grafik-Files im Zielsystem an (alles wasim Ordner „Config“ angelegt wird, kann problemlos gelöscht werden)
…Script entfernt…
also bei mir scheint dein install-script leider nicht zu funktionieren.
was passiert denn? Oder was auch nicht?
Gruß
hardlog
Bei mir geht der web Editor auf. In diesem Fall Microsoft expression, und zeigt mir eine leere Seite an.
hmm,
ich weiß nicht genau was du da meinst.
Hast Du es so wie in post #6 beschrieben versucht? Mach mal nen screenshot vom Objektbaum an relevanter stelle und poste noch mal dein script.
hardlog
ja hab es so gemacht und es funktioniert.Wie begrenze ich die Kommastellen?
also bei mir scheint dein install-script leider nicht zu funktionieren.
Das Script ist kein Installscript und kann nicht gehen. Ich habs mal rausgenommen.
ja hab es so gemacht und es funktioniert.Wie begrenze ich die Kommastellen?
Begrenzung der Nachkommastellen z.B. mit dem php-Befehl ROUND mit Angabe der Stellenzahl (0-xx).
<td valign='top'><font size='+2'>***Füllung: ".round($fuellung,1)." %</td>
Also soweit funktioniert jetzt alles.
Mir ist aber aufgefallen das die Aktualisierung der Werte in diesem Script nicht ganz so fix ist wie Sie aus der SPS (WAGO 881 über GB-LAN) kommen.
Beim vergleich in der WF Visu von einer einfachen REAL-Anzeige und der Anzeige über das Script, scheint es eine ewigkeit zu dauern ehe mal was aktualisiert wird. In den instanzen sind 300ms eingestellt.
Wie mache ich den Aktualisierungsintervall für das Script schneller bzw fast 1:1?
Gleichzeitig ist das eine gute Basis für viele weiter Visualisierungsideen.
LG, Herbert
Hallo, habe mit deiner Füllstandsanzeige rumprobiert.
Sieht auch alles ganz gut aus. Habe deinen php Code genommen und etwas abegändert.
Nur wie hast du wie im diesem Bild:
es hinbekommen, die Anzeige daneben anzeigen zu lassen ?
Viele Grüße
Jörg
Hi Jörg,
der entsprechende php-Code-Teil sieht bei mir so aus:
$html="
<table border='0' cellpadding='0' cellspacing='0' width='420' frame='void'>
<tr>
<td height=186 width=150 align='center' style='background-image:url(/user/zisterneoben.gif);' valign='bottom'>
<font size='+2'>".$fuellung." %
<img src='/user/wasser.gif' width='128px' align='center' height='".($fuellung*0.66)."%'></img>
</td>
<td colspan='2' rowspan='2' width=250 valign='top'></br>
<span style='font-size:150%'>***Füllung: ".($fuellung*4500/100)." l</span>
<font color='grey'><font size='2'>
</br>*****Temperatur: ".$temp." °C
</br>*****∑ Regensammelfläche ".$Flaeche." m²
</br>*****Δ Vol. letzte 24h: ".$Regenmenge." l = ".round($Regenmenge/$Flaeche,0)." l/m²
</br>*****Δ Vol. letzte 1 h: ".getvalue(57967 /*[Gebäude\Außen L\Regenwasserzisterne\Zisternen viso\Fuellstand vor 1h\regenmenge der letzten h]*/)." l
</br>*****=> ".round(getvalue(57967 /*[Gebäude\Außen L\Regenwasserzisterne\Zisternen viso\Fuellstand vor 1h\regenmenge der letzten h]*/)/$Flaeche,2)." l/m² Regen pro h
<p style='margin-top:0.8em'>*****Status: Sensor ".$DrucksensorStatus." / 1-wire ".$OnewireStatus."</p>
</td>
</tr>
<tr>
<td height=12 width=150 align='left' style='background-image:url(/user/zisterneunten.gif);'>
</tr>
</table>";
Gruß
hardlog
Hallo,
SUPER