Dynamische Grafik mit PHP

Heute ist Stammtischzeit:
Jeden Donnerstag 20:30 Uhr hier im Chat.
Wer Lust hat, kann sich gerne beteiligen. ;)
  • Hallo zusammen,

    ich grüble gerade über folgendes Problem:

    auf einer Seite, die mit PHP erzeugt wird, soll eine Grafik in Form eines Liniendiagramms angezeigt werden.
    Die Daten für das Diagramm kommen aus einer mysql-Datenbank auf dem raspi (oder sonstwo ... ist erstmal egal).
    Die Daten sind allerdings jetzt Messdaten, die in Intervallen aktualisiert werden.

    Mein Vorhaben nun:
    1. Die Grafik erzeugen (hab' ich noch nie gemacht, phpgraphlib_v2.31 macht da aber auf mich einen guten Eindruck)
    2. Die Grafik in einer dynamischen Seite (php) anzeigen und jetzt kommt mein eigentliches Anliegen
    3. Die Grafik mittels der neuesten Daten aus der Datenbank laufend aktualisieren und diese Grafik - und wenn möglich wirklich nur diese Grafik - auf der Seite, solange sie im Browser angezeigt wird, laufend aktualisieren.

    Hat da vielleicht jemand eine Idee, ist das überhaupt möglich oder hat jemand so was sogar schon mal gemacht?
    Wär jedenfalls schön ein paar Anregungen zu bekommen.

    Viele Grüße aus dem in Sonnenschein gebadeten Rosenheim,
    -ds-

    PS: vielleicht irgendwie über "embed" oder so?
    Ach ja: und möglichst ohne zuviel zusätzlichen Schnickschnack wie flash oder mp4-Frames erzeugen und diese als "Film" abspielen ... ich denke, das würde den Rahmen sprengen. Je einfacher umso besser.

  • http://jpgraph.net/ ich kann dir nur dies sehr empfehlen, es erzeugt einen Graphen den man sehr leicht anpassen kann (siehe Beispiele auf der Seite), das dynamische könnte man einfach per js oder ajax lösen. (ich denke nach der ausgabe mit den headern kann man immernoch skripte durch pushen sodass diese ausgeführt werden)

    Soweit ich es in erinnerung hab, war die index.php sehr einfach aufgebaut sodass man da alles bearbeiten konnte, wenn nicht einfach einen kleinen host schreiben der die grafik sich vom graphen holt und diesen dann einfach aktualisiert

    Einmal editiert, zuletzt von Tasty (8. Mai 2013 um 15:12)


  • http://jpgraph.net/ ich kann dir nur dies sehr empfehlen, es erzeugt einen Graphen den man sehr leicht anpassen kann (siehe Beispiele auf der Seite), das dynamische könnte man einfach per js oder ajax lösen. (ich denke nach der ausgabe mit den headern kann man immernoch skripte durch pushen sodass diese ausgeführt werden)

    Soweit ich es in erinnerung hab, war die index.php sehr einfach aufgebaut sodass man da alles bearbeiten konnte, wenn nicht einfach einen kleinen host schreiben der die grafik sich vom graphen holt und diesen dann einfach aktualisiert

    Danke für den Tipp ...

    Ich hab mir das Teil mal runtergeladen und probiere es grad aus. Ist zwar ein ganz schöner Klops mit gut 12 MB und scheint mir ein wenig zu umfangreich für meine popelige Kurve.
    Klingt aber lt. Beschreibung gut und vielleicht will ich ja mal ein wenig mehr machen als nur eine Liniengrafik.
    Nur sollte man es nicht - so wie ich vorhin - aus dem hohlen Bauch nach Gefühl installieren, es sei denn, man will seine Frustrationstoleranz-Grenze austesten.
    Aber hier ist die Installation ganz gut beschrieben.

    Was das permanente Nachladen der Grafik betrifft, fiel mir auch noch was ein: könnte man die Grafik nicht einfach in einen Frame packen und dann diesen Frame quasi dauernd "refreshen" ... damit entfiele das Nachladen der ganzen Seite ...

    Grüssle und bis dann dann,
    -ds-

    So ....

    danke Euch beiden zunächst nochmal.
    Grafik erzeugen ist jetzt kein Problem.
    Die Frage ist jetzt: wie läuft das mit der dynamischen Grafik.
    Davon hängt imho auch die Erzeugung der Grafik ab, denn wenn die Grafik immer wieder "reloaded" wird, dann würde das eine Neuerzeugung der Grafik mit PHP anstossen.
    Mir wäre allerdings wesentlich lieber, dass die Grafik (z.B. mit den Daten der letzten 24 Stunden) zunächst komplett angezeigt wird und dann quasi wie ein Film im - keine Ahnung, vielleicht 10 Sekunden-Takt - mit den neuesten Daten aktualisert wird. Also quasi eine Endlos-grafik mit einem fest definierten Beginn aber keinem Ende.
    Im nächsten Schritt würde ich dann gerne die "Granularity" - also die Zeitachse ändern. Also Anzeige der Daten für z.B. 1 Jahr / 1 Monat / 1 Woche / 1 Tag / 1 Stunde ...

    Ich guck' mir jetzt mal Ajax an ... da scheint es auch eine Möglichkeit zu geben, die Seiten mit PHP zu erzeugen und auf den ersten Blick ist das genau das, was ich gesucht hatte.

    Bis später mal,
    -ds-

  • Genau Ajax ist das was du suchst Content nachzuladen oder zu erneuern und die achsen verändern geht auch siehe beispiele auf der Seite. ;)

    freut mich das ich dich weiterbringen konnte.

  • ... und bin so klug als wie zuvor .... um es mal literarisch auszudrücken ;)

    Die Grafik sieht ja prima aus - ein bisschen besser beschriften müsste noch sein.

    Aber: wie kriege ich das jetzt mit dem Dauer-Nachladen oder dem "Endlosfilm" bzw. der "Endlosgrafik" hin?

    Kann mir da bitte mal jemand einen Tipp geben, wo ich da bei Ajax ansetzen müsste, sonst such ich mir vermutlich einen Wolf.

    Danke schon mal und bis später mal,
    -ds-


  • http://stackoverflow.com/questions/1092…efresh-an-image in diesem Beispiel wird jede 5 sekunden das Bild aktualisiert. ;)

    Ahja damit das ganze läuft musst du folgende Werte abändern:
    - "#image1" (bild-id)
    - "image_feed.php?CAMERA_URI=<?=$camera_uri;?>" (Bild URL)
    - "5000" (Aktualisierungs-interval)

    Hi tasty,

    perfekt ... jetzt weiß ich wenigstens, wo ich ansetzen muss.
    Ich denke, ich werde das dann wohl hinbekommen.
    Vielen Dank,
    ich meld' mich, egal ob's klappt oder kracht :D


    Code
    Du kannst setTimeout benutzen um eine JS Funktion nach einer bestimmten Zeit wieder aufzurufen, damit kannst du 
    dann dein Diagramm aktualisieren


    Danke Björn,
    da hab' ich dann wenigstens noch eine Alternative ;)

    Da bin ich jetzt aber mal gespannt ....
    Grüsse aus dem Regenland,
    -ds-

  • Hi,

    vielleicht noch als Abschluss:

    hat alles prima geklappt ...
    ein bisschen Kosmetik noch in den C- und PHP-Sourcen, dann kann ich das abhaken.


    Ich hänge mal nen screenshot an ...

    Danke allen nochmal und viele Grüsse aus dem trüben Süden,
    -ds-

  • HAllo.

    habe ein paar Fragen zu S0-Zähler. Kannst mir jemand schreiben welchen Zähler habt Ihr genommen?
    ich suche gerade einen im Internet, da habe ich so einen gefunden. Wie denkst ihr, wird er auch passen? [font="Tahoma, Verdana, Arial, sans-serif"]Impulslänge 90ms?[/font]

    Meine Frage ist, kann ich den direkt an RPi anschließen und dann Impulse zählen? Wie schließe ich denn an?

    Wird es richtig, wenn ich S+ von Zähler mir +3.3 V vo RPI verbinde und dann S- von Zähler mir GPIO verbinde? oder es wird besser eine Koppelrelais dazwischen schalten?
    Wie ich verstanden habe S0 ist nicht ein potentialfreier.


    was muss ich noch beachten

    SWISSNOX SX-1LA
    Anschluss 1x230V 5/50A, 50/60Hz
    Genauigkeitsklasse 1
    Befestigung DIN-Hutschiene (DIN EN50022) / 1TE=18mm (DIN 43880)
    Impulslänge 90ms
    Zählimpulse 1000imp/kWh
    Anzeige 5 + 1 = 99999.9 kWh
    Gewicht 100g
    Stromverbrauch =0.4W, =8VA
    Betriebsbereich 184-265 VAC; 0,02 ~ 50A
    Frequenzbereich 50Hz oder 60Hz +/- 10%
    Temperaturbereich -20°C bis +55°C
    Rel.Luftfeuchtigkeit bis 75% - kurzfristig bis 95%

    Vielen Dank Voraus

  • Ja hallo,

    da wäre es hilfreich etwas mehr zu erfahren - also was Du vorhast und was für Komponenten Du da jetzt ins Auge gefasst hast.
    Nach einem ersten Eindruck ist das, was Du da gepostet hast, bereits ein Impulszähler - also vermutlich genau das, was der RPi mal machen sollte.

    Impulsgeber wäre da vielleicht richtiger ... bzw. Nachrüsten mit einer S0-Schnittstelle ...

    Aber das ist jetzt eben nur Spekulation ...

    cu,
    -ds-

  • Einwenig Offtopic: Hast Du einen bestimmten Grund, warum Du den Graphen auf dem Raspberry rendern möchtest? Erfahrungsgemäß lastet das den Pi ziemlich stark aus. Ich setze bei meinen Graphen mittlerweile auf Highcharts (JavaScript) und bin sehr zufrieden.

    Die Library bietet auch die Möglichkeit neue Werte nachzuschieben, ohne alles erneut zeichnen zu müssen.

Jetzt mitmachen!

Du hast noch kein Benutzerkonto auf unserer Seite? Registriere dich kostenlos und nimm an unserer Community teil!