HTML and CSS Reference
In-Depth Information
Bildbearbeitung
Die Manipulation von Bilddateien war in den letzten Jahren nur mit Serverkompo-
nenten wie GDlib und ImageMagick machbar, selbst einfache Vorschaubilder muss-
ten auf dem Server umgerechnet werden. Seit der Entwicklung von Canvas geht der
Trend nun zur Verarbeitung im Browser, mittlerweile gibt es komplexe Bildbearbei-
tungs-WebApps, die den Vergleich mit einem professionellen Grafikprogramm, wie
z. B. Adobe Photoshop nicht scheuen müssen.
Graphen und Diagramme
Ein beliebter Anwendungsfall sind Diagramme: Wurden diese für Statistikwebseiten
und Co. früher entweder als statische Bilder vom Server berechnet oder als Flash-Plug-
in angezeigt, werden sie heute interaktiv auf der Canvas gerendert.
4.5.5 Canvas-Bibliotheken
In der Praxis ist es recht mühselig, komplexe Canvas-Zeichnungen zu programmie-
ren. Glücklicherweise gibt es für typische Anwendungsfälle bewährte und kostenlose
Code-Bibliotheken, auf die Sie in der App-Entwicklung zurückgreifen können. Im Fol-
genden wollen wir Ihnen einige davon vorstellen.
jqPlot
Die Bibliothek jqPlot wurde als Open-Source-Projekt von Chris Leonello ins Leben
gerufen (Abbildung 4.57). Als Ergänzung für das in Abschnitt 2.5, »Entwickeln mit Java-
Script-Frameworks - jQuery & Co.«, erwähnte jQuery-Framework nutzt sie die Canvas-
Funktionen, um relativ einfach interaktive Graphen und Diagramme anzulegen. Sie
müssen lediglich eine JavaScript-Datei in Ihre HTML-Seite einbinden, ein div -Element
anlegen und der Bibliothek per jQuery-Befehl die Diagrammdaten übergeben:
$(document).ready(function(){
var plot1 = $.jqplot ('chart1', [[3,7,9,1,4,6,8,2,5]]);
});
Das Framework unterstützt geläufige Diagrammtypen wie Balken-, Linien- oder Tor-
tendiagramme (Abbildung 4.58). Mit etwas mehr Aufwand können Sie Daten per
AJAX nachladen, Tooltips einfügen oder Diagramme vergrößerbar machen.
http://www.jqplot.com/
Search WWH ::




Custom Search