Anloge Uhren mit Angular.js und Moment.js

Ein einfaches Beispiel analoger Uhren mit Angular.JS, implementiert als Directive (wie auch sonst ;-)). Die Zeitzonen werden mit Moment.JS ermittelt und die einzelnen Uhren werden als Vektorgrafiken (SVG) animiert.

Natürlich lassen sich dynamisch neue Zeitzonen hinzufügen, klicken Sie dazu einfach auf den + Button und wählen Sie die gewünschte Zeitzone aus.

{{timezone}}

{{timezone}}

{{timezone}}

Data Visualization mit D3

D3.js ist eine hervorragende JavaScript Bibliothek zur daten-basierten Manipulation eines Dokuments. D.h. mit D3 können Live-Daten visualisiert und jederzeit aktualisiert werden.

D3 unterstützt HTML, CSS und SVG. Somit lassen sich skalierbare Vektorgrafiken mit Real-Time-Data veröffentlichen.

Hier sehen Sie ein simples Beispiel auf Basis von HTML und CSS.

Hier handelt es sich um eine einfache Test-Suite, die via Iframe eingebunden wurde. Dabei wurde auf ein responsives Verhalten im Sinne von RWD (Responsive Web Design) bewußt verzichtet.

Über den Button NUMBERS können die Daten aktualisiert werden. Mit ON wird die Aktualisierung zyklisch durchgeführt, was in einer Real Time App via AJAX oder Web-Sockets ereignisgetrieben angestoßen würde.

Kontakt zu uns!

imagine orange
bodanstr. 3a, 88690 uhldingen-mühlhofen
Tel. +49 (0) 7556 931 63 30