t3n News Software

6 Tools für Diagramme in Webseiten und Web-Apps

6 Tools für Diagramme in Webseiten und Web-Apps

Graphen und Diagramme sind nützliche Werkzeuge zur Visualisierung von Daten und Darstellung von komplexen Sachverhalten. Mit diesen 6 Tools können Webworker ihre Webseiten und Web-Apps um Clientseitig generierte Diagramme erweitern.

6 Tools für Diagramme in Webseiten und Web-Apps

gRaphaël

graphael_diagramme

gRaphaël basiert auf der JavaScript Library Raphaël, die Webworker bei der Arbeit mit Vektorgrafiken im Web unterstützen soll. Die unter MIT-Lizenz stehende Library benutzt SVGs und VML als Basis um verschiedene Grafiken zu erstellen. So können neben Kreis-, Balken und Liniendiagrammen auch deutlich komplexere Grafiken unter Firefox 3.0+, Safari 3.0+, Opera 9.5+ und Internet Explorer 6.0+ generiert werden.

Highcharts

highcharts_diagramme

Highchats ist eine Diagramm-Bibliothek, die auf HTML5 und JavaScript basiert und interaktive Charts für Webseiten und Web-Applikationen bietet. Sie unterstützt derzeit eine Vielzahl von Diagrammtypen und erlaubt auch die Kombination verschiedener Diagramme untereinander. Die Bibliothek funktioniert in allen modernen Browsern, darunter auch iOS und Android. Highcharts ist in der Version 3.0 unter der Creative Commons Lizenz für nichtkommerzielle Projekte oder ab 90$ erhältlich.

jqPlot

jqplot_diagramme

jqPlot ist ein kostenloses jQuery Plugin für die Erstellung von Linien- Balken und Kuchendiagrammen mit zahlreichen Features. Neben dem Styling der Diagramme, ist es möglich Tooltips und Hover-Effekte zum Diagramm hinzuzufügen. jqPlotwurde unter IE7, IE8, Firefox, Safari und Opera in den aktuellen Fassungen getestet.

Flot

flot_diagramme

Flot ist eine JavaScript-Bibliothek für die Erstellung von Graphen mit jQuery, die vor allem einfach zu nutzen, gut aussehen und interaktive Features bieten soll. Flot unterstützt Liniendiagramme, Punkte, gefüllte Bereiche und Kombinationen ebendieser. Außerdem stehen zahlreiche Plugins für erweiterte Funktionalität zum Download bereit. Flot funktioniert mit Internet Explorer 6+, Chrome, Firefox 2+, Safari 3+ und Opera 9.5 und steht unter MIT-Lizenz kostenlos zur Verfügung. Neben der Dokumentation und Beispielen stehen einige Video-Tutorials auf Youtube für einen leichten Einstieg zur Verfügung.

Google Graphs

google_graphs_Diagramme

Google Graphs stellt für die Erstellung verschiedenster Graphen-Bibliotheken mit zahlreichen Diagramm-Typen und Schnittstellen zur Verfügung. Die Ausgabe erfolgt mit HTML5 und SVG und ist somit in allen modernen Browsern möglich. Google Graphs ist kostenlos und mit vielen Beispielen und lässt sich dank einer ausführlichen Dokumentation schnell in die Seite einbringen. Neben der Generierung von statischen und interaktiven Grafiken kann die Bibliothek außerdem dynamische Daten verarbeiten und die Ausgaben entsprechend anpassen.

JS Charts

jschart_diagramme

JS Charts ist eine auf JavaScript basierende Diagramm-Bibliothek, die mit sehr wenigen Eingaben zurechtkommt. Das Skript ermöglicht die Erstellung von Linien, Balken, Kreisdiagrammen und funktioniert mit einer Vielzahl von Browsern. Neben zweidimensionalen Grafiken ist eine perspektivische Ausgabe und Animationen möglich. JS Charts ist kostenfrei – mit Wasserzeichen – erhältlich.

Weiterführende Links

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
2 Antworten
  1. von Cadje am 24.04.2013 (12:26 Uhr)

    Hier habt Chart.js vergessen

    Antworten Teilen
  2. von add24 am 24.04.2013 (13:54 Uhr)

    Flot ist mein Favorit!
    Kann viel und ist leicht konfigurierbar.

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema
Sandstorm: Kinderleicht und sicher dezentrale Web-Apps auf dem eigenen Server installieren
Sandstorm: Kinderleicht und sicher dezentrale Web-Apps auf dem eigenen Server installieren

Sandstorm ermöglicht es Jedem, dezentrale Web-Apps auf einem eigenen oder gehosteten Server innerhalb von wenigen Sekunden zu installieren – ohne sich mit Server-Administration oder Sicherheit … » weiterlesen

Kein Coding notwendig: Mit diesem Tool baut ihr Web-Apps per Drag & Drop
Kein Coding notwendig: Mit diesem Tool baut ihr Web-Apps per Drag & Drop

Mit den sogenannten Action Blocks bietet der Website-Builder Weld jetzt auch eine Möglichkeit, um interaktive Web-Apps per Drag & Drop zusammenzubauen. Wir haben uns das Tool für euch angeschaut. » weiterlesen

Mit Bubble funktionierende Web-Apps ohne eine Zeile Code bauen
Mit Bubble funktionierende Web-Apps ohne eine Zeile Code bauen

Mit dem Baukasten Bubble sollt ihr auch komplexere Web-Apps einfach zusammenklicken können. Wir haben uns das Tool für euch angeschaut. » weiterlesen

Alle Hefte Jetzt abonnieren – für nur 35 €

Kennst Du schon unser t3n Magazin?