scriptwelt blog

Um Daten einem ausgedehnten Publikum zu präsentieren, wurde im Web häufig mit Abobe Flash oder Progressing für die Java-Virtual-Machine gearbeitet. Seit ein paar Jahren  setzt sich jedoch immer mehr JavaScript durch. Das ist sicherlich der interaktion durch Ajax und der Umsetzung verschiedener JavaScript Bibliotheken zu verdanken. Auch die JavaScript-Portierung von Progressing durch John Resig hat dem sicherlich einigen Vorschub gegeben.

Deshalb möchte ich heute 7 der wichtigsten Javascript Libraries zur Visualisierung aufzeigen:

Processing.js

ist eine Javascript-Umsetzung der Sprache Processing.  Die JavaScript Version Processing.js ist eine offene Programmiersprache, die es erlaubt Bilder, Animation und Interaktionen für das Netz zu programmieren, ohne Flash- oder Java-Applet zu verwenden.  Dabei verwendet Processing.js das HTML5 <Canvas> Element, um Formen zu zeichnen und zu manipulieren.

flot

ist eine Javascript-Bibliothek zum einfachen Erstellen von  Diagrammen und  ein Plugin für das JavaScript-Framework jQuery. Besonderer Wert wird bei Flot auf Interaktivität und das Aussehen gelegt.

Firefox 2+, Safari 3+, Opera 9 and Internet Explorer 6, 7 & 8

Sparklines

wie float ein Plugin für jQuery. Mit Hilfe von Sparklines lassen sich Sparklines, auch Inline-Diagramme oder small inline charts genannt, darstellen. Ein Beispiel eines Sparklines

Firefox 2+, Safari 3+, Opera 9, Google Chrome and Internet Explorer 6, 7 & 8.

Das Visualize PlugIn für jQuery

ermöglicht es aus den Daten in einer HTML-Tabelle ein Diagramm zu erzeugen. Bei deaktiviertem JavaScript wird statt der Balken, Linien, Flächen oder Torten-Diagramme  einfach die HTML Tabelle angezeigt.

IE6, IE7, IE8, Firefox 2, Firefox 3.5, Safari 3 and 4, Opera 9

milkchart für MooTools

ist ein Plugin für MooTools mit dem sich HTML-Tabellen in Grafiken konvertiert lassen. Es stehen Column, Bar, Line, Pie und Scatter Diagrammformen zur Verfügung. Milkchart benutzt das <canvas> Element von HTML5 und funktioniert deshalb nicht auf allen Internet Explorer Varianten.

Raphaël

ist eine Javascript-Bibliothek  zum Erstellung von Vektorgrafiken.  Dabei verwendet Raphaël das SVG des W3C Recommendation und Vector Markup Language (VML) als Basis. Dadurch unterstützt Raphaël auch den Internet Explorer.  Die Vektorgrafiken legt Raphaël als DOM-Objekte an, so daß  diese mit Javascript-Event-Handlern verknüpft und auch später noch modifiziert werden können.

Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+.

JavaScript InfoVis Toolkit

ist eine Javascript-Bibliothek mit Schwerpunkt auf dynamische Visualisierung von hierarchischen Daten. Es lassen sich Baumstrukturen anzeigen und immer weiter verzweigen. Die Bibliothek unterstützt TreeMaps, Radial Layouts, HyperTrees/Graphs  und  SpaceTrees.

IE6+, Firefox2+, Safari3+, Opera9.5+