Information Technology Reference
In-Depth Information
color[2],
255-(parseInt((r+g+b)/3.0))
];
};
Die vorgestellten Filter sind noch sehr einfach gestrickt, da sie Farbwerte ein-
zelner Pixel immer ohne Berücksichtigung der Nachbarpixel verändern. Be-
zieht man diese in die Berechnung ein, sind komplexere Methoden wie Schär-
fen, Unschärfemasken oder Kantenerkennung möglich.
HINWEIS
Um den Rahmen dieses Buches nicht zu sprengen, sei an dieser Stelle auf
die
Pixastic Image Processing Library
von Jacob Seidlin verwiesen (
http://www
. pixastic.com/lib/
). Über 30 unter der Mozilla Public License stehende Java-
Script-Filter warten darauf, entdeckt zu werden.
Wir wenden uns derweil Thomas Porter und Tom Duff zu, zwei Gurus der Pixar
Studios, die schon im Jahr 1984 mit ihrem Artikel über Alpha-Blending-Tech-
niken Furore machten. Die von ihnen beschriebenen digitalen Compositing-
Techniken erhielten nicht nur einen Preis der
Academy of Motion Picture Arts
and Sciences,
sondern fanden auch Einzug in die Canvas-Spezifikation.
5.9 Compositing
So vielfältig die Möglichkeiten für Compositing in Canvas sind, so spärlich
gesät sind gute Beispiele für den Einsatz derselben im Netz. Die meisten
beschränken sich auf eine Darstellung der Methoden per se, und genau das
wollen wir zu Beginn ebenso tun. Abbildung 5.30 zeigt gültige Keywords des
globalCompositeOperation
-Attributs, deren Entsprechung bei Porter-Duff (kur-
sive Beschriftungen mit
A
,
B
) sowie das Resultat nach dem Zeichnen.
Zuerst wird jeweils das blaue Rechteck als Hintergrund gezeichnet, dann die
gewünschte Composite-Methode gesetzt und zum Schluss der rote Kreis hin-
zugefügt. Für die erste Methode,
source-over
, die auch der Defaultwert für das
globalCompositeOperation
-Attribut ist, lautet der Code demnach:
context.beginPath();
context.fillStyle = 'cornflowerblue';
context.fillRect(0,0,50,50);
context.globalCompositeOperation = 'source-over';
context.arc(50,50,30,0,2*Math.PI,0);
context.fillStyle = 'crimson';
context.fill();
