Datenvisualisierung in HTML5 mit HumbleFinance

Fast jedes Trackingtool bzw. eCommerce-Paket visualisiert heutzutage Daten als Graphen. Dabei werden entweder Verkaufszahlen oder Besucherzahlen in netten Grafiken visualisiert. Beispiele hierfür sind zum Beispiel das Dashboard von Google Analytics, bzw. das Dashboard von Magento. Die meisten dieser Systeme haben jedoch eins gemeinsam: Anstatt die Daten direkt darzustellen, schicken sie diese an ominöse Flash-Movies, die diese Aufgabe dann übernehmen. Gefüttert wird das Movie in der Regel mit AMF oder XML.

Demo-Anwendung von HumbleFinance

Dies ist weder sinnvoll noch performant. Sinnvollerweise könnte man das Ganze unter anderem zum Beispiel mit dem Canvas-Element von HTML5 lösen. Dies ist zwar aufwendig, aber möglich. Noch einfacher wird, dass Ganze wenn man eine fertige, auf HTML5 basierende Toolbox verwendet! HumbleFinance ist eine solche Toolbox, die eigentlich zur Visualisierung von Geschäftszahlen (Aktienkurse) gedacht ist, sicher aber natürlich auch zweckentfremden lässt.

Die Demo besitzt die gleiche Funktionalität wie Google Finance, das wiederum Flash benutzt. Schnell merkt man bei der Anwendung wie hochperformant HTML5 sein kann und eigentlich sollte das Tool Standard für 2D-Graphen im Internet werden: schneller und einfacher geht es nicht mehr!

Ähnliche Beiträge

html2canvas – Screenshots mit JavaScript Wenn man mal überlegt, womit sich man sich als Blogger so seine Zeit vertreibt, wird man auf eins sehr schnell kommen: Screenshots. Die kleinen Bieste...
Preloader-Grafik als Canvas-Element online erstell... Jeder kennt sie, keiner stellt sie her: die netten rotierenden Kreise die von jeder Lightbox verwendet, oder auch bei Ajax-Aufrufen kurzzeitig eingebl...
Respsonsive Design Testing Tool Screenqueri.es Das man heutzutage ein neues Design responsive aufbauen sollte lässt sich wohl nicht mehr weg diskutieren, wie es vielleicht vor einem Jahr noch mögli...
InstaCSS – die Referenz in Sachen CSS3 / HTM... Ich ergehe mich ja nicht oft in Superlativen, aber in Sachen CSS3 / HTML5 Dokumentation besteht mancherorts echt Nachholbedarf. Man bewegt sich dort i...

Schreibe einen Kommentar