Forum: Mikrocontroller und Digitale Elektronik NET IO - Daten - grafisch im Web zur Verfügung stellen (Diagramm etc.)


von Maddin (Gast)


Lesenswert?

Hi,

ich habe ein Messgerät mit einer seriellen Schnittstelle.

A) Ich möchte die Messgerätedaten auf SD Karte speichern 
(Erweiterungsmodul zur NET IO mit sd Karte)

B) Ich möchte die Daten auf einer einfachen Webseite im internen Netz 
zur verfügung stellen.

Zu A) Zu der NET IO gibts nur ein hex file, oder? Wie wird dort die sd 
Karte mit eingebunden? Kann ich in die SW von Pollin einen parser 
einbinden um mein Messgerät damit zu adaptieren?

Zu B) Hat schon mal jemand daten grafisch zur verfügung gestellt mit der 
NET IO? Wie ist dabei die einfachste Vorgehensweise? Gibt es ein tool 
welches man mit der NET IO als Webserver nutzen könnte, oder eine lib 
o.ä.?

Vielen Dank,
m.

Ps.: Ist nicht eigentlich Ulrich Radig der Urheber der Software, konnte 
den Webserver mit ENC ship so ad hoc garnicht mehr dort finden...

von JJ (Gast)


Lesenswert?

http://www.mikrocontroller.net/articles/AVR_Net-IO_Bausatz_von_Pollin

http://www.ulrichradig.de/home/index.php/avr/eth_m32_ex

ggf. den Mega32 gegen 644 austauschen.

Zu deinem Grafik-Website Thema kann ich dir leider nicht weiterhelfen. 
Es gibt aber sicher etwas dazu...

JJ

von Karl H. (kbuchegg)


Lesenswert?

JJ schrieb:

> Zu deinem Grafik-Website Thema kann ich dir leider nicht weiterhelfen.
> Es gibt aber sicher etwas dazu...


Frage in die Runde:
Was haltet ihr an dieser Stelle von SVG?
(zu geschwätzig? zu umständlich? von zu wenigen Browsern unterstützt?)

Direkt auf der Net I/O für ein Diagramm ein Gif zu erzeugen .... bin mir 
nicht sicher, ob ich mir das antun würde.

von Konrad S. (maybee)


Lesenswert?


von Chris R. (hownottobeseen)


Angehängte Dateien:

Lesenswert?

Karl Heinz Buchegger schrieb:
> Was haltet ihr an dieser Stelle von SVG?
> (zu geschwätzig? zu umständlich? von zu wenigen Browsern unterstützt?)

SVG ist schön (soweit ich es beurteilen kann), allerdings würde ich in 
Verbindung mit einem µC eher etwas mit Javascript und canvas machen.
Das kann auch jeder modernere Browser und zudem muss der AVR keine 
XML-Datei erstellen/ausgeben.

Ich habe bei einem Projekt eine Json-Ausgabe im AVR implementiert, die 
von einer Website aus abgerufen und in Diagramme (Sparklines) 
umgewandelt wird.
Sieht u.a. so aus wie im Anhang. Das Hintergrundbild liegt auf einem 
größeren Webserver, der Farbverlauf beim Puffer entspricht dem 
Temperaturgradienten und wird wie die Sparklines per Javascript erzeugt.

Wenn Interesse am Code besteht, gerne ;)

von Maddin (Gast)


Lesenswert?

Hi,

vielen Dank für die Rückmeldung.

Ich möchte ein Hutschienenmodul auf Basis des Net IO Bauen, das wäre 
kein Problem. Teile habe ich alle standardmäßig da. Erster Test wäre eh 
auf einem NET IO von Pollin, um zu sehen ob es generell möglich ist.

Ich habe einen 3 Phasen Netzanalysator (Gavazzi EM24):

http://www.energiapositiva.eu/Impianti_Fotovoltaici/cablaggi_collaudo_contatori/contatori_utf_mid_gse/Scheda_Tecnica_Em24din.pdf

In unserer Hausanschlussleitung integriert. Dieser hat eine RS485 
Schnittstelle, dazu habe ich einen RS485 232 Konverter mit Testsoftware 
auf meinem Bastel PC am laufen.

Ziel 1 wäre es mit dem NET IO die Daten vom EM24 auf die SD zu 
schreiben.

Ziel 2 diese Daten ins Hausinterne Netz zu stellen. Ethernet liegt 
bereits über einen Devolo vor ort.

Im dritten Schritt würde ich mir eine TV-Internet-box im 
Zigarettenschachtelformat zulegen um das ganze am TV sichtbar zu machen.

Ziel 2 ist meiner Meinung nach der Knackpunkt an meinem Projekt, denn 
ich frage mich ob der Mega32 die grafische Darstellung bewältigt 
bekommt.

Ich muss mich zudem erstmal mit dem Thema Webdesign beschäftigen, c ist 
kein Problem, aber HTML, PHP, JAVA, XML etc - nie gemacht - und ich gehe 
an die Themen eher mit dem Elan (Mittel zum Zweck) ran. Es wäre mir 
lieber das einfach zu halten. Muss auch nicht her machen, nur praktisch 
sein...

Gruß,

M.

von Maddin (Gast)


Lesenswert?

@ Chris:

Wie funktioniert das denn genau? Was ist das für eine 
Programmiersprache? Wäre das etwas für kleinen SPeicher?

Gruß,
M.

von hownottobessen (ohne Login) (Gast)


Lesenswert?

Hi,

Maddin schrieb:
> Wie funktioniert das denn genau? Was ist das für eine
> Programmiersprache? Wäre das etwas für kleinen SPeicher?

Auf dem AVR werkelt eine Abwandlung der Software von Ulrich Radig. Zwei 
HTTP-Requests habe ich auf Funktionen umgeleitet, die Paket für Paket 
den Json-Code zusammenbauen und aufs Netz legen. Mit kleinem Speicher 
(RAM) geht das zwar auch, macht aber nicht so viel Spaß, da man stärker 
fragmentieren muss. Deswegen habe ich den Mega32 sehr schnell aus dem 
Net-IO rausgeworfen und einen Mega644 eingesetzt.

Die HTML-Seite (bzw. ein Javascript darin) ruft die Json-"Dateien" dann 
per XmlHttpRequest ab, welcher z.B. wie folgt beantwortet wird:
1
{"time":1339621076,"uptime":6521971,"air_press":0,"wp":{"ht":false,"pwr":false},"solar":{"low_p":false,"temp":[11.6,33.2,30.7,888.8,888.8,27.7,34.8,48.1,888.8,50.1,24.1,24.4],"radiation":0,"impulse":[0,0],"sensor":{"broke":280,"short":0,"usage":71},"pump":[0,0,0,0,0,0,0,0,0,0],"relais":67,"errors":0,"warnings":0,"time":1317,"timestamp":1339621075},"meters":[{"uml":7,"t_uml":1454,"t_uml_l":1091},{"uml":0,"t_uml":65535,"t_uml_l":65535},{"uml":0,"t_uml":65535,"t_uml_l":80},{"uml":0,"t_uml":65535,"t_uml_l":65535}]}

über einen Json-Parser wird der Code in ein Javascript-Objekt 
verwandelt, das dann für die Anzeige im Browser aufbereitet wird.

Das "lustige" ist, dass der HTML-Body lediglich aus folgenden Tags 
besteht:
1
<body>
2
<ul id="tablist"></ul>
3
<div id="img-container"></div>
4
<div id="lvhistory"></div>
5
<div id="lvdays"></div>
6
</body>

der restliche Inhalt wird erst nach dem Laden generiert.
Das sieht zwar für den nicht-Javascript/HTML-Kenner sehr ungewöhnlich 
aus, ist aber in der Hinsicht praktisch, da man kleine 
Formatierungsänderungen sehr schnell global machen kann. Genauso lässt 
sich Javascript im Gegensatz zu HTML noch ein Stück weit komprimieren 
(siehe Google Closure Compiler), sodass man den Code zur Not auch direkt 
in den AVR-Flash packen kann (was ich jedoch für Verschwendung halte).

Zum erstellen der Grafiken verwende ich das <canvas>-Element, deren 
Inhalt in etwa einer PictureBox im .NET-Universum entspricht (wobei man 
zeichnen kann, wo und wie man will, es gibt kein Paint-Event). Ein guter 
Anlaufpunkt dafür ist 
http://blog.nihilogic.dk/2009/02/html5-canvas-cheat-sheet.html bzw. 
https://developer.mozilla.org/en/Canvas_tutorial

Grundsätzlich kann ich für die Entwicklung eine lokale Testseite (leere 
HTML-Seite mit <canvas>-Element) + Firebug empfehlen. Mit großem 
Konsolenfenster kann man sehr schnelle Gehversuche machen. Wenn man 
etwas verbockt hat, reicht ein Druck auf F5 und man kann wieder von 
vorne starten.

Quellcodes kann ich morgen erst posten, da ich auf dem Notebook hier 
nicht alles beieinander habe.

Viele Grüße

Chris

von ... (Gast)


Lesenswert?

Maddin schrieb:
> Ich möchte ein Hutschienenmodul auf Basis des Net IO Bauen,

So etwas? 
http://wiki.volkszaehler.org/hardware/controllers/hutschienencontroller_v2

von Maddin (Gast)


Lesenswert?

Hi,

naja, es ist auch ein Hutschienenmodul und es hat Ethernet - naja und 
dann wars das auch schon mit den Gemeinsamkeiten. Bei Volkszähler war 
ich auch bereits schon mal - kann damit nicht so viel anfangen...

Ich habe nun den Webserver von Ulrich auf meinem NET-IO Bausatz zum 
laufen bekommen, war nun nicht so das Kunststück...

Es werden 3 grüne Butten (gifs) erzeugt und für den AD-Wandler gibt es 4 
Balkendiagramme auf der Site. Vielleicht könnte ich bereits diese 
einfachen Grafiken zu darstellung meines Energieverbrauches über Jahr, 
Monat,Tag und aktuell zweckentfremden...

Es ist der 2te Absatz hier:

http://www.mikrocontroller.net/articles/AVR_Net-IO_Bausatz_von_Pollin

unter:

U. Radigs Webserver

Naja, der Atmega644 ist unterwegs. Nächste Schritte wären für mich:

1) auf einem Atmega644 zum laufen bekommen
2) 485 vom gavazzi Zähler Protokoll auswerten
3) SD Karte mit einbinden ?
3.1) RTC
4) Webserver manipulieren und erweitern
5) Hardware bauen:

Umfang:

1)Serielle Schnittstelle (über Konverter an den Gavazzi Zähler 
angeschlossen)
2)Ethernet über ENC
2.1) SD Karte (1GB) zum mitloggen
3)On Board Netzteil (Traco - wie beim Volkszähler)
4)Ein Schaltkanal 16A/230V Potenzialfrei.
5)Kleine Anzeige/Display

Das ganze sollte in ein 2Einheiten Modul wie der Volkszähler passen.

Gruß,
M.

PS.: Es werden später folgende Werte dargestellt:

Spannung L1/L2/L3
Strom L1/L2/L3
Leistung L1/L2/L3/G
Blindleistung L1/L2/L3/G
Scheinleistung L1/L2/L3/G
Gesamtverbrauch

Zudem fände ich eine Taste zur Nullen (Grafik auf 0 setzen) im 
Momentanverbrauchsmodus ganz gut. Beispiel:

L1 wird im Momentanverbrauchsmodus grafisch dargestellt. Meinetwegen die 
Momentane Leistung auf der Phase (380Watt), Update sekündlich. Bevor ich 
das zu ermittelde Gerät einschalte resette ich L1/Leistung auf 0Watt 
(relativ). Klar schwanken die Werte immer etwas, aber so kann man den 
Verbraucher dann einschalten und besser erfassen.

von Maddin (Gast)


Angehängte Dateien:

Lesenswert?

Hi,

bin gerade mal am Zähler Testen. Im Anhang die Listung der Parameter...

Maddin

von GaSSSt (Gast)


Lesenswert?

komisch... Drei Threads, drei verschiedene Namen und OPs, aber alles 
NET-IO

von chris (Gast)


Lesenswert?

Mrtg ist ein Standard um Datenwerte, wie Temperatur, Verbrauch, ...
darzustellen. Funktioniert bestens auch mit netio

von CHH (Gast)


Lesenswert?

Ich habe was ähnliches auf der Basis vom Net-IO am Laufen:
Auf dem Net-IO läuft "openMCP". Es werden von diversen Funksensoren die 
Daten eingesammelt und auf SD gespeichert.

Der Net-IO kann die Daten als Graph ausgeben ... Dafür habe ich eine 
Webseite hinterlegt, dass die eigentlichen Messwerte über ein CGI Script 
vom Net-IO abholt. Das CGI gibt die Daten dabei im Json Format zurück um 
sie auf der Webseite einfach(er) verarbeiten zu können.

Zur eigentlichen Darstellung der Daten verwende ich auf der Seite 
"Highcharts" (www.highcharts.com) - eine mögliche Alternative wäre 
vermutlich auch die Google Chart API.

Meine Lösung hat den Vorteil, dass alles auf dem Net-IO direkt gehostet 
wird - also keine externen Rechner etc. benötigt werden. Klarer Nachteil 
- es ist ziemlich aufwendig und langsam viele Daten zu verarbeiten.

von Maddin (Gast)


Lesenswert?

Hi Chris,

bin ich hier:

http://de.wikipedia.org/wiki/Multi_Router_Traffic_Grapher

richtig?

Wie kann ich denn dieses Programm auf dem Atmega implementieren? Hattest 
du nicht die Json-Ausgabe vorgeschlagen.
Bitte etwas ausfürhlicher, ich bin in dem Bereich nicht sehr erfahren.

Letztendlich wäre etwas am besten das man einfach auf einen 
speicherbereich des uc "zeigen" lassen könnte. X und Y Achse könnten 
immer da sein. Im Speicher liegen meinetwegen 512 8Bit Werte. Damit 
könnte ich dann ein Diagramm erzeugen welches 512 x 256 Pixel groß ist - 
so in der Art.

Klar kommen dann noch die Punkte:

Skalenbeschriftung,
Darstellung mehrer Werte,
und vielleicht die Farbliche separierung...

Letztendlich hängt das dann wohl vom SRAM des uc ab.

Ich befürchte eh, dass der uc das nicht schaffen wird.

Gruß,
M.

von Chris R. (hownottobeseen)


Angehängte Dateien:

Lesenswert?

Maddin schrieb:
> Wie kann ich denn dieses Programm auf dem Atmega implementieren?

Ist sicher möglich, dürfte aber wenig Spaß machen (und sehr aufwendig 
sein)

> Hattest
> du nicht die Json-Ausgabe vorgeschlagen.
> Bitte etwas ausfürhlicher, ich bin in dem Bereich nicht sehr erfahren.

Den Quellcode für den AVR (bzgl. Json-Ausgabe) kannst du dir unter 
http://hobbyelektronik.org/w/index.php/Energieerfassung#Downloads 
herunterladen.

Interessant dürfte für dich wahrscheinlich energy.c sein, dort ist ein 
Großteil des Zusammenbauens der Pakete.

Ich hab einfach mal die Quelltexte für die Aufarbeitung im Browser 
zusammengepackt, aber unter Ausschluss jeder Garantie und Gewährleistung 
;)
Die Code ist auch ziemlich unaufgeräumt und wurde nur unter Firefox 
getestet.

Zum Ablauf: Beim Öffnen der Seite wird sie durch Javascript mit divs und 
Textnodes sowie canvas-Elementen bestückt. Alle 30 Sekunden werden die 
Daten vom NET-IO geladen und in den Textnodes aktualisiert sowie in 
Arrays angehängt, die dann über die Datei canvas_sparkline.js geplottet.

Wie bereits geschrieben, für das Canvas-Zeug schaust du dir am besten 
die Seiten an, die ich in meinem Posting weiter oben 
(Beitrag "Re: NET IO - Daten - grafisch im Web zur Verfügung stellen (Diagramm etc.)") erwähnt hab, das 
dürfte ein relativ guter Einstieg sein, wenn du dich durch die 
Grundlagen von Javascript durchgeknabbert hast ;)

HTH

Chris

von Horst S. (h3aau)


Lesenswert?

moin moin,

bin gerade dabei meine heizung mit einem myavr mit openmcp aufzustocken.
meine sensoren gehen und die daten landen auf der sd.
nun möchte ich gern noch zusätzlich meldungen die von einem externen 
sensor über die uart reinkommen als CSV-datei auf der sd ablegen.
hat jemand ein beispiel wie ich auf der sd mit open/write/read/close die 
daten in das CSV-file bekomme?

danke.

von Horst S. (h3aau)


Lesenswert?

kleiner nachtrag....
in openmcp ist unter TEMP_LOGGER schon eine grafische ausgabe von daten 
drinn. schon mal angeschaut?

von Horst S. (h3aau)


Lesenswert?

habe mal versucht das aus dem ctlogger zu übernehmen.
die datei wird erstellt aber es wird nix reingeschrieben.
gibt da wohl noch probleme mitt dem umstellen auf das filesystem.....

von ja nee bitte nich (Gast)


Lesenswert?


von Horst S. (h3aau)


Lesenswert?

das ist ethersex...
ich habe und will openmcp nehmen.

Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.