Farbenlehre Additive und subtraktive Farbmischung

Transcription

Farbenlehre Additive und subtraktive Farbmischung
Inhalt
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Farben
1.
Additive und subtraktive Farbmischung............................2
1.1.
Primärfarben, Mischfarben, Farbkreis.................................3
1.2
Subtraktive Farbmischung, CMYK ......................................4
2.
RGB - Farbmodell ...................................................................6
2.1
RGB - Mixer .............................................................................8
3.
Farbwahrnehmung...............................................................14
3.1
Kenngrößen, RGB .................................................................14
3.2
CIE - Farbmodell...................................................................16
3.3
HSB - Farbmodell .................................................................21
Seite 1
Additives und subtraktive Farbmischung
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Alles so schön bunt hier ......
Additives und subtraktives Farbmischen
Farben sind eine höchst subjektive Sache und es mag wohl auch etwas daran sein, wenn es
heißt:
"Die Welt ist nur deshalb bunt, weil der Mensch unterschiedliche Wellenlängen des Lichtes als Farben
wahrnimmt."
Wir wissen nicht, ob Tiere etwas, das wir als Rot sehen auch als farbig sehen. Wir können noch
nicht einmal sicher sein, dass unser jeweils individueller Eindruck von Rot oder Blau auch bei
anderen Menschen den identischen Eindruck hinterläßt.
Für Physiker scheint das mit den Farben recht einfach zu sein. Farben sind bestimmten Wellenlängen zugeordnet und die kann man schließlich messen. Für unseren täglichen Umgang mit
Farben und speziell bei Farben, die auf Monitoren und gedruckt auf Papier zu sehen sind, ist
die Tatsache der physikalischen Messbarkeit allerdings nicht sehr hilfreich.
Addieren von Farben
Das menschliche Auge nimmt Farben entsprechend den Wellenlängen des Lichtes wahr. Das
volle Spektrum reicht von Rot bis Blauviolett und umfaßt die als Regenbogenfarben bekannten
Das Spektrum des weißen Sonnenlichtes
Farbtöne. Fallen alle dies Farbkomponenten als Licht ins Auge, wird das als Weiß empfunden.
Ist kein Licht vorhanden, wird das als Schwarz gesehen ( wenn man da noch von sehen sprechen kann).
Ein großer Teil des Regenbogenspektrums kann dadurch erzeugt werden, dass die drei Grundfarben Rot, Grün und Blau gemischt werden. Dieses Verfahren der Farbmischung ist als
"Additives Mischverfahren" bekannt. Additive Farben mischen sich insgesamt zu weißem Licht.
Das sollte man mal im Physikunterrichtsraum probieren:
Nimmt man z.B. drei Lampen, die weißes Licht aussenden und läßt das Licht dieser Lampen
durch Farbfilter fallen, dann gibt die Addition in der Tat wieder weißes Licht.
Seite 2
Primärfarben, Mischfarben, Farbkreis
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Lampe
blauer Filter ( nur blaues Licht wird
durchgelassen )
grüner Filter ( nur grünes Licht wird
durchgelassen )
Lampe
roter Filter ( nur rotes Licht wird
durchgelassen )
Lampe
Dieses Experiment klappt recht gut und zeigt auch gleich noch einige wichtige Mischfarben:
Cyan, Magenta und Gelb.
Rot
Gelb
Magenta
Cyan
Blau
Grün
Diese Primärfarben und deren Mischung ergeben zusammen den Farbkreis, in dem die
Mischfarben Magenta, Gelb und Cyan jeweils zwischen den Grundfarben angeordnet sind, aus
deren Mischung sie entstehen.
Seite 3
Primärfarben, Mischfarben, Farbkreis
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
In diesem Farbkreis liegen sich die Komplemetärfarben gegenüber. Das sind Farbpaare, die zu-
Gelb
sammen gemischt Weiß ergeben.
Beispiel:
Blau + Gelb = Weiß
Rot
Grün
weil :
Gelb = Rot + Grün und damit
Blau + Gelb = Blau + ( Rot + Grün) = Weiß
Auch die Röhren eines Fernsehgerätes oder ei-
Magenta
Cyan
nes Computermonitors funktionieren nach diesem System. Drei Elektronenstrahlen, die durch
Blau
eine Lochmaske geschickt werden, bringen
Phosphorfarbpunkte zum Leuchten.
Die Oberfläche ist von innen mit Dreiergruppen aus roten, grünen und blauen Phosphorpunkten beschichtet. Da diese Punkte sehr eng beieinanderliegen, kann durch unterschiedlich starke
Anregung dieser Phosphorleuchtpunkte jede Farbe durch additive Farbmischung erzeugt werden. Genauere technische Details kann man nachlesen.1
Subtraktive Farbmischung
Wenn man das oben dargestellte Verfahren mit den Farben aus einem Malkasten probiert,
dann ist schnell klar, dass man mit Rot, Grün und Blau nicht Weiß zusammenmischen kann,
sondern bestenfalls eine Art schmutziges Braunschwarz. Das hat mit der Tatsache zu tun, dass
Farbpigmente nicht selbst leuchten, was für die additive Farbmischung Voraussetzung wäre,
sondern nur Licht reflektieren.
Diese subtraktive Mischung ist aber schnell erklärt:
Angenommen, man will cyan und gelbe Farbpigmente mischen. Die Cyan - Farbpigmente reflektieren nur blaues und grünes Licht, weil ja Cyan diese Farbanteile enthält. Die gelben Farbpigmente reflektieren grüne und rote Lichtanteile. Werden diese Pigmente jetzt gemischt, kann
man nur die Lichtanteile sehen, die von beiden Pigmente noch reflektiert werden, und das
wäre in diesem Falle die Farbe Grün.
1
W.D. Fellner, "Computergrafik", Bi-Wissenschaftsverlag S. 13 ff
Seite 4
Subtraktive Farbmischung, CMYK
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Es ergibt sich folgendes Bild:
Magenta
Cyan
Blau
Rot
Grün
Yellow (Gelb)
Subtrakitve Farbmischung
Theoretisch ergibt die Mischung aller Grundfarben ( hier Cyan, Magenta und Gelb) wieder
Schwarz, was aber in der Praxis nicht ganz funktioniert.
In der Drucktechnik wird daher als vierte "Farbe" reines Schwarz benutzt und man spricht
dann vom CYMK - Modell ( Cyan Magenta Yellow BlacK). Es heißt wohl nicht CMYB-Modell,
da der Buchstabe B schon bei RGB (s.u. ) vergeben war.
Das RGB - Modell
Nicht alle natürlichen Farben können auf die oben beschriebene Weise additiv aus Rot , Grün
und Blau gemischt werden. Bevor wir darauf näher eingehen, sollen uns zuerst die Farben beschäftigen, die wir so darstellen können.
Ein gängiges Verfahren der Darstellung der RGB - Farben besteht darin, die Anteile der Grundfarben an einer Mischfarbe als Zahlenwert anzugeben. Entweder als (Prozent-) zahl zwischen 0
und 1 oder als Wert zwischen 0 und 255 ( das entspricht einer Zahlendarstellung durch 8 Bit ).
Der Zahlenwert Null bedeutet dabei, dass die Farbe überhaupt nicht vorkommt und der Wert
1 (100%) bzw. 255 bedeutet, dass die Farbe vollständig vorkommt ( was immer das auch bedeuten mag ).
Wenn man auf diese Weise für Rot, Grün und Blau jeweils 256 Abstufungen möglich macht,
dann hat man insgesamt 256*256*256 = 16777216 Farben zur Verfügung.
Seite 5
Das RGB - Modell
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Um diese Information digital darstellen zu können, braucht man jeweils 8-Bit für die Darstellung einer Zahl zwischen 0 ( Dual : 00000000 ) und 255 (Dual : 11111111).
Eine grafische Darstellung dieses RGB-Farbraumes ist ein einem Koordinatensystem möglich:
Grün
( 0, 1, 0 )
( 0, 255, 0 )
( 1, 1, 0 )
( 255, 255, 0 )
Grün
Gelb
( 0, 1, 1 )
( 0, 255, 255 )
Weiß
( 1, 1, 1 )
( 255, 255, 255 )
Cyan
( 0, 0, 0 )
( 0, 0, 0 )
Rot
Rot
Schwarz
Blau
( 1, 0, 0 )
( 255, 0, 0 )
Magenta
( 0, 0, 1 )
( 0, 0, 255 )
( 1, 0, 1 )
( 255, 0, 255 )
Blau
Diese Darstellung findet man in vielen Büchern und Universitätsscripten. Als Mathematiker
wundert man sich sicher ein wenig. Wir haben bei R - G - B erwartet, dass sich R an der
x1 - Achse befindet und G an der x2- Achse und damit B an der x3 - Achse. Hier aber ist B an
der x1 - Achse eingetragen ,obwohl bei den Zahlentripeln als dritte Zahl angegeben. Da aber
die Festlegung der Achsen nicht immer so sein muss, wie in Schulbüchern zur analytischen
Geometrie, werden wir mit dieser ungewohnten Art der Achsensortierung schon klar kommen,
denn in Wahrheit stimmt das Koordiantensystem schon, auch wenn es aus einer "falschen"
Blickrichtung dargestellt ist.
Jeder Punkt in diesem Einheitswürfel hat nun eine klar definierte Farbe. Will man alle diese
Farben sichtbar machen, so klappt das nicht, da der Würfel dann ja nicht so transparent wäre,
wie oben zu sehen. Wir könnten also eine Draufsicht auf die äußeren Flächen erzeugen oder
aber einen beliebigen Schnitt durch den Würfel parallel zu einer Seitenfläche darstellen lassen.
Seite 6
Das RGB - Modell
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Mit einem kleinen Java Applet kann man die Seitenflächen darstellen.
Die Fläche soll 256 x 256 Punkte groß sein, damit wir alle Farbkombinationen auf der Fläche erfassen können. Auf der Vorderfläche ändern sich dann die Farben:
Horizontal: Rot = 0 bis Rot = 255 ; Vertikal: Grün = 0 bis Grün = 255 und Blau = 255 konstant.
Auf der Deckenfläche:
Horizontal: Rot=0 bis Rot = 255; Vertikal: Blau = 0 bis Blau = 255 und Grün = 255 konstant
Auf der rechten Seitenfläche:
Horizontal: Blau = 255 bis Blau = 0 (von vorn nach hinten )
Vertikal: Grün = 0 bis Grün = 255 ( von unten nach oben )
Vom Java Applet erzeugte
Farbflächen
Die drei einzelnen Bilder kann man schnell
mit einem Grafikprogramm zusammenschieben, nachdem man sie mit einem Screenshot
gesichert hat. ( Die Frage, wie man diese 3DAnsicht korrekt perspektivisch dargestellt in
einem Programm erzeugen kann, stellt sich
hier noch nicht, spielt aber später bei geometrischen Aufgaben ( 3D - 2D ) noch mal eine
Rolle.
Die grauen Linien wurden nachträglich eingefügt.
Hinweis: In einigen Büchern ist die Reihenfolge der Koordinatenachsen - wie oben angemerkt - mathematisch "korrekt" festgelegt wor-
RGB - Farbraum
den, so dass die Farbflächen dann natürlich
anders aussehen.2
2
Kompendium der Mediengestaltung, Springer 2000
Seite 7
Das RGB - Modell, der RGB - Mixer
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Aufgabe:
Schreibe eine Javaapplet, dass die oben gezeigten Farbflächen ausgibt und erzeuge das perspektivische Bild mithilfe eines Grafikprogramms.
Die Erzeugung von RGB-Farben in Java wurde bereits in den Anfangskapiteln behandelt und
kann dort nachgelesen werden.
(siehe auch die folgenden Seiten ).
Ein netter Einschub
Auch wenn es nicht direkt zum Hauptthema gehört, werden wir hier ein kleines Programm
einstreuen, in dem es um die RGB-Farben geht. Obendrein werden einige weitere Möglichkeiten von MouseEvents angesprochen.
Es soll ein Programm geschrieben werden, in dem mit drei Schiebereglern die möglichen
RGB- Mischfarben erzeugt werden. Mit der Maus werden dazu Rot-,Blau und Grünregler verschoben und in entsprechenden Farbfeldern immer die einzelnen Farbkomponenten und die
Mischfarbe angezeigt, wie im Screenshot zu sehen.
Im Applet gibt es ein Hintergrundbild im jpg-Format und drei kleine Bilder ( die Schieberegler ) im GIF-Format.
Seite 8
RGB - Mixer
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Weiterhin sind vier Rechtecksflächen für die Farbfelder vorgesehen und drei weitere Rechtecksflächen für die Angabe der Farbwerte. Dabei wurden keine Label verwendet, vielmehr
waren die Flächen bereits in der Hintergrundgrafik vorgesehen.
Das ganze sieht nett aus. Die Grundlagen für dieses Programm sind uns auch in weiten Teilen
schon bekannt.
Laden und Darstellen der Bilder
Schon bei der Behandlung von Threads und im Beispiel "Pong" wurden Bilder geladen und
am Bildschirm gezeigt.
Einige Programmausschnitte reichen deshalb hier aus, um das Vorgehen zu zeigen:
//*****************************************************************
Ein nettes schickes Programm zum RGB Farbmixen
Kenntnisse zum Einlesen und Zeigen von Bildern der Typen jpg und gif aus
dem Programmbeispiel "Pong"
Kenntnisse aus "Malen mit der Maus" also elementare Mouseevents
Kenntnisse zum Clipping aus dem Pong-Programm
Kenntnisse zum RGB-Farbraum
Februar 2002
©Hans-Georg Beckmann
//*****************************************************************
import
import
import
import
java.awt.*;
java.awt.event.*;
java.applet.*;
java.lang.*;
// das Übliche zu Beginn
public class RGBMixer extends Applet
{
Image
offScreenImage
= null;
// ein Bild, dass wir nicht sehen
Graphics offScreenGraphics
= null;
Dimension offScreenSize
= null;
// offScreengraphics für das offScreenImage mit der Größe aus offScreenSize
Image meinBG;
// das Hintergrundbild
Image R_Rot,R_Blau,R_Gruen;
// die kleinen GIF-Bilder (Regler )
MediaTracker myTracker;
// der Medienspürhund
//********************************************************************
// Die kleinen Bilder haben alle eine Größe, ihre yPosition ist immer konstant
// bei der Darstellung am Bildschirm wird immer ihre linke obere Ecke benutzt
// die Bildmitte wird für die Festlegung des jeweiligen Farbwertes verwendet
//*********************************************************************
int Rot_y =157;
// Werte der Position über der Hintergrundgrafik
int Gruen_y =194;
int Blau_y
=232;
int Rot_x =30;
// die jeweilige Horizontale Position
int Gruen_x =30;
int Blau_x
=30;
Color rotflaeche,gruenflaeche,blauflaeche,mixflaeche; // alle Farbflaechen
boolean inrot=false,inblau=false,ingruen=false;
// ist die Maus im Rotregler,Blauregler,Gruenregler ?
int rotwert=0,blauwert=0,gruenwert=0;
// Position des Reglers entspricht diesem Farbwert
Seite 9
RGB - Mixer
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
public void init()
{
offScreenSize = getSize();
// Hole Dimension aus HTML/Appletwindow
offScreenImage = createImage(offScreenSize.width,offScreenSize.height);
// erzeuge OffScreenImage
offScreenGraphics = offScreenImage.getGraphics(); // füge Graphicsobjekt hinzu
MediaTracker myTracker = new MediaTracker(this);
// ein neuer Spürhund
showStatus("lade Bilder...");
// showStatus = Nachricht zeigen
//*************************************************************************
// Lade die Bilder
//*************************************************************************
meinBG = getImage(getDocumentBase(), "RGBMixer.jpg"); // Bild holen
myTracker.addImage(meinBG,0);
// Achtung Tracker,hier kommt das erste Bild ...
try
{myTracker.waitForID(0);
} catch(InterruptedException e) {}
// Fehler abfangen für Bild ID 0
offScreenGraphics.drawImage(meinBG,0, 0, null);
// jetzt malen
R_Rot = getImage(getDocumentBase(), "red.gif");
myTracker.addImage(R_Rot,1);
try
{myTracker.waitForID(1);
} catch(InterruptedException e) {}
offScreenGraphics.drawImage(R_Rot,Rot_x,Rot_y, null); // malen an richtiger Stelle
Die anderen Bilder werden genauso eingelesen und an der richtigen Startposition gezeichnet
.
.
.
Neues zu MouseEvents
Zur Behandlung von MouseEvents stellt Java zwei Klassen zur Verfügung:
MouseListener und MouseMotionListener.
Der Empfänger für MouseEvents ist in unserem Falle eine eigene Klasse und muss die Klasse
MouseListener implementieren oder das Interface MouseAdapter erweitern.
Dabei gilt es die Methoden mousePressed, mouseReleased, mouseClicked, mouseEntered und mouseExited ggf. zu überschreiben. Die Bezeichnungen erklären auch schon die Funktion dieser Methoden. Die Ergebnisse der Mausaktionen werden in einem MouseEvent an die aufrufende Komponente übermittelt.
Eine weitere Klasse ist der MouseMotionListener, bzw. das Interface MouseMotionAdapter der sich
ausschließlich um die Bewegung der Maus kümmert. Die Methode mouseMoved wird verwendet,
wenn die Maus ohne Tastendruck bewegt wird. Die Methode mouseDragged wird gebraucht,
wenn beim Ziehen der Maus die Maustaste gedrückt und festgehalten wird.
Man kann z.B. also mit der Methode mousePressed den Start einer Mausaktion festhalten, mit
mouseDragged Informationen über den "Weg" der Maus erhalten und zum Schluss mit mouseReleased das Ende der Mausaktion untersuchen.
Alle genannten Methoden sollen im Programm Verwendung finden.
Mit mousePressed wird geprüft, ob der Mauszeiger innerhalb eines der drei Schieberegler gedrückt wurde.
Seite 10
RGB - Mixer
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Mit mouseDragged wird dann der Weg des Schieberegelers erfasst und die entsprechende Aktualisierung der Grafik vorgenommen.
Mit mouseReleased wird die Information von mousePressed zurückgestellt.
( Wie schon oft, könnte man MouseListener und MouseMotionListener auch in der Kopfzeile des
Programms dem ganzen Applet durch implements ... zuweisen und dann auf eigenen Klassen
verzichten ).
In der init - Methode des Applets werden die beiden Klasseninstanzen erzeugt:
//**************************************************************************
// Nun wird dem ganzen Applet ein MouseListener und ein MouseMotionListener
// zugeordnet, desssen Klassendefiniton unten steht
//**************************************************************************
addMouseListener(new mListener());
// Listener für Maus
addMouseMotionListener(new mMotionListener());
// Listener für Mausbewegungen
} // ende von init
Am Ende des Applets werden die beiden zugehörigen Klassen stehen:
//***********************************************************************************
// Nun eine Klasse für den MouseListener. Man kann entweder implements MouseListener
// wählen und dann die vollständige Liste der Pflichtmethoden überschreiben oder
// wie hier das Interface extenden . Das Interface ist der Mouseadapter.
// Dabei muss man nicht alle Methoden überschreiben.
//
//***********************************************************************************
class mListener extends MouseAdapter
{
public void mousePressed(MouseEvent e)
{
int ix=e.getX();
// getX holt die aktuelle x-Koordinate der Maus
int iy=e.getY();
// aktuelle y-Koordinate
// Stelle fest, ob im Bereich des Rotreglers
if(ix>Rot_x&&ix<Rot_x+33&&iy>Rot_y&&iy<Rot_y+24) // Maus drin !!
{
inrot=true;
}
.
.
genauso für blau und grün
.
}
//**********************************************************
// wird die Maustaste losgelassen, dann alle auf false setzen
//**********************************************************
public void mouseReleased(MouseEvent e)
{
inrot=false;
inblau=false;
ingruen=false;
}
} // Ende von MouseListener Klasse
Seite 11
RGB - Mixer
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
//*******************************************************************************
// Jetzt die Methoden für den MouseMotionListener. mouseMoved und mouseDragged
// müssen für dass Interface geschrieben werden dabei können diese Methoden
// auch leer sein
//********************************************************************************
class mMotionListener extends MouseMotionAdapter
{
public void mouseMoved(MouseEvent e)
// bleibt leer
{}
public void mouseDragged(MouseEvent e)
{
int ix,iy;
ix=e.getX();
// hole die aktuellen Koordinaten
iy=e.getY();
if ( inrot==true)
// diese Information stammt aus mousePressed
{
Rot_x=ix;
// Position des Rotreglers
// Damit der Regler am Bildschirm nicht zuweit rutscht nun Einschränkungen
if(Rot_x>275){Rot_x=275;}
if(Rot_x<20){Rot_x=20;}
}
.
.
genauso für die beiden anderen Regler
.
.
repaint();
// muss sein, da es in paint nicht vorkommen soll
} // Ende von mousedragged
} // Ende von MouseMotionListener Klasse
Vorher steht im Programm natürlich schon die paint-Methode, die für uns die Hauptarbeit
macht.
//*********************************************************************************
//
// Nun die Paintmethode
//
//**********************************************************************************
public void paint(Graphics g)
{
g.drawImage(offScreenImage,0,0,this); // zeichnet das OffScreenImage jetzt in g
offScreenGraphics=offScreenImage.getGraphics();
if(inrot==true)
{
offScreenGraphics.setClip(10,Rot_y-10,400,40);
offScreenGraphics.drawImage(meinBG,0, 0, null);
// jetzt malen
Seite 12
RGB - Mixer
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
offScreenGraphics.drawImage(R_Rot,Rot_x, Rot_y, null);
// jetzt malen
rotwert=Rot_x-20;
// Regler immer 30 Punkte vom Rand, Reglermitte=10 vom linken Rand
if(rotwert>255){rotwert=255;} // keine Überschreitung zulassen
if(rotwert<0){rotwert=0;}
offScreenGraphics.setColor(rotflaeche);
offScreenGraphics.drawString(""+rotwert,331,172);
rotflaeche=new Color(rotwert,0,0);
offScreenGraphics.setClip(37,104,52,33);
offScreenGraphics.fillRect(37,104,52,33);
} // Ende von if inrot
else
if(inblau==true)
{
.
.
. usw.
} // Ende von if inblau
else
if(ingruen==true)
{
.
.
.usw.
}// Ende von if ingruen
// Nun alle Farbflächen auf den aktuellen Stand bringen
mixflaeche=new Color(rotwert,gruenwert,blauwert);
offScreenGraphics.setColor(mixflaeche);
offScreenGraphics.setClip(304,104,52,33);
offScreenGraphics.fillRect(304,104,52,33);
g.drawImage(offScreenImage,0,0,this);
} // Ende von paint
public void update(Graphics g)
{
paint(g);
}
In der paint-Methode werden nacheinander die einzelnen Flächen der Grafik, die erneuert werden müssen, als Clippingregion festgelegt. Danach wird im OffScreen gemalt und erst am Ende
wird alles in g gezeichnet.
Aufgabe:
Benutzen sie das vorgestellte Programmgerüst und schreiben sie ein Applet "RGB-Mixer". Erzeugen sie die Bilder, die benötigt werden, nach eigenem Geschmack und achten sie auf das richtige
Bildformat.
Seite 13
Farbwahrnehmung
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Zurück zu den Farben
Wie oben schon zu erahnen, ist das mit den Farben eine sehr schwierige Sache. Da fast alle Dinge in unserer Umwelt Licht nicht nur einer Wellenlänge aussenden oder reflektieren, nützt es
uns wenig, den subjektiven Farbbegriff einfach an Wellenlängen des Lichtes zu koppeln. Wenn
das ginge, könnte man sich erfolgreich darüber Gedanken machen, ob es eigentlich endlich viele
oder unendlich viel Farben gibt. Befragen sie ruhig mal einen Physiker zu dieser Problematik.
Wenn wir von Mischungen von Wellenlängen ausgehen müssen, dann ist verständlich, dass das
RGB-Modell wohl kaum alle Farben darstellen kann , die in der Natur denkbar sind. Auf der anderen Seite geht man davon aus, dass Menschen maximal 350000 Farben unterscheiden können.
Unter diesen Randbedingungen stellen sie sich bitte vor, eine rote Fläche auf einem Bildschirm
zu sehen. Möglicherweise ist die Fläche gar nicht einheitlich rot, sondern enthält viele Rotabstufungen aus dem RGB-Farbraum. Die könnten so dicht beieinander liegen, dass sie für unsere
Augen nicht unterscheidbar sind. Es könnte aber auch sein, dass nur der Monitor schlecht ist,
und er daher die Unterschiede nicht zeigen kann. Wir sind skeptisch und lassen uns den Bildschirminhalt auf einem guten Tintenstrahldrucker ausgeben. Damit haben wir die Lage aber zu
verschlimmert, denn jetzt kommt das CMYK-Modell möglicherweise zum Tragen. Wie werden
nun unsere Rotabstufungen erscheinen ? Wahrscheinlich hängt das auch noch vom verwendeten
Papier ab.
Alles zeigt, dass Farben sich einer einfachen Behandlung entziehen, und das erhöht eigentlich
die Freude über die Farbenpracht der Natur, die sich nicht so einfach digitalisieren lässt.
Farbwahrnehmungen, Kenngrößen
Für die Farbempfindung sind unterschiedliche Faktoren verantwortlich. Wenn ein Körper Licht
reflektiert oder emittiert, dann nehmen wir eine dominante Wellenlänge wahr, diese wird FARBE genannt ( HUE ). Dieser Zusammenhang zwischen Farbeindruck und physikalischer Größe
(Wellenlänge) wird ist zwar subjektiv aber es gilt: Blau entspricht einer Wellenlänge zwischen
450 nm und 480 nm, Grün wird für Wellenlängen zwischen 500 nm und 550 nm wahrgenommen. Für Gelb gilt der Bereich von 570 nm bis 580 nm. Rot wird für den Bereich zwischen
620 nm und darüber angenommen.
Die zweite Kenngröße für die Farbwahrnehmung ist die Reinheit der Farbe. Je enger der Wellenlängenbereich, der an der Farbe beteiligt ist, desto reiner erscheint die Farbe. Diese Größe wird
als SÄTTIGUNG oder REINHEIT ( SATURATION oder PURITY) der Farbe bezeichnet.
Die dritte Größe ist die HELLIGKEIT ( LUMINANCE oder BRIGHTNESS oder VALUE), die an
die Intensität des Lichtes gekoppelt ist. Je höher die Intensität, desto heller erscheint die Farbe.
Nun sind diese Größen nicht ohne Weiteres messbar. Wir haben oben schon mit dem RGB-Farbraum den "umgekehrten" Weg kennengelernt, bei dem es nicht darum ging, eine wahrgenommene Farbe nach ihren Kenngrößen zu untersuchen, sondern Mischfarben aus reinen Grundfarben zusammenzustellen.
Die dabei entstandene Palette von Farben nennt man auch Gamut oder Color-Gamut.
Mit den Grundfarben Rot, Grün und Blau haben wir schon den RGB-Farbraum erzeugt, den
man auch zweidimensional darstellen kann, wenn man eine Normierung einführt.
Setz man fest R + G + B = 1 dann kann man ein Koordinatensystem erzeugen, das auf der x-Achse den Rotanteil von 0 bis 1 enthält und auf der y-Achse den Grünanteil von 0 bis 1. In einem
rechtwinkligen Dreieck - wie auf der nächsten Seite zu sehen findet man dann für jeden Punkt
Seite 14
Farbwahrnehmung, RGB - Farbraum
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
grün
1
0,75
gelb
cyan
0.5
0.25
blau
magenta
rot
0
0
0.25
0.5
0.75
1
RGB - Dreieck
auch einen blauen Farbanteil, der sich
aus 1- R - G ergibt.
Hat man einen Dreieckspunkt mit den
Koordinaten (0,5 / 0,2 ), dann bedeutet
das 50 % Rot, 20 % Grün und damit also
30% Blau. In RGB-Werte im Bereich 0 bis
255 umgerechnet entspricht das : R= 128,
Grün = 52 und Blau =76
Damit wird aber auch schon klar, wo der
Nachteil dieser Methode liegt:
Die Zusammenstellung R=256, G=104
und B=152 würde die gleiche Farbe wie
oben erzeugen allerdings mit einer sehr
viel höheren Helligkeit. Es geht also bei
dieser Darstellung eine Kenngröße der
Farbwahrnehmung verloren. Der Vorteil
ist die Zweidimensionalität der Darstellung, die im 3D-Farbwürfel nicht zu haben war. Und dort hatten wir das Problem, nicht in den den Würfel hinein
schauen zu können.
RGB - Dreieck mit angepasster
Helligkeit
Das Dreieck enthält alle schon mehrfach erwähnten Grundfarben und läßt sich mit einem einfachen Applet erzeugen.
Dazu wird der grüne Anteil der RGB-Farbe von 0 bis 255 verändert. Daraus ergibt sich jeweils
die y-Koordiante des Bildpunktes. Die x-Koordiante, die den roten Anteil repräsentiert verändert
sich immer von 0 bis 256 - Grünanteil. Der blaue Anteil an der RGB-Farbe ist dann jeweils der
Rest zur Gesamtsumme 1.
Seite 15
Farbwahrnehmung, CIE - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
public void paint( Graphics g )
{
for(y=0;y<256;y++)
// Für die y-Koordinate
{
for(x=0;x<255-y;x++)
// für die x-Koordinate
{
rot=x*(0.00390625);
// 0.00390625 = 1/256
gruen=y*(0.00390625);
// Gruenanteil
blau=1-rot-gruen;
// Blauanteil
blauwert=(255*blau);
rotwert=(255*rot);
gruenwert=(255*gruen);
myFarbe=new Color((int)rotwert,(int)gruenwert,(int)blauwert);
g.setColor(myFarbe);
g.fillRect(40+x,300-y,1,1);// Im KS 40 vom linken Rand, 300 ist y-Linie
} // Ende von for x
} // Ende von for y
} // Ende von paint
Man sieht das Ergebnis oben im linken Bild. Alle erwarteten Farben sind vorhanden, aber die Eigenschaft "Helligkeit" fehlt. Wieder gibt es ein reines Weiß , noch ein reines Schwarz, das die
RGB-Werte (0,0,0) haben müßte.
Will man das ganze Bild etwas aufhellen, muss man eine Helligkeitsanpassung vornehmen.
Hebt man alle RGB-Werte so an, dass der größte der drei Werte immer das Maximum von 255
erreicht, wird das ganze Bild heller ( siehe oben rechts ). Jetzt kann man auch bei x=0,333 (30%
Rot) , y=0,333 ( 30 % Grün) eine halbwegs weiße Stelle im Dreieck finden, weil bei diesen Koordinaten auch 30% Blau vorhanden ist.
Das CIE - Farbsystem
1931 wurde eine Methode zur Kennzeichnung von Farben vereinbart, die auf der additiven Farbmischung der drei Grundfarben Rot, Grün und Blau basiert. Die Commision Internationale de
l'Eclairage (CIE) - was "Internationale Beleuchtungskommission" bedeutet - legte ein Verfahren
fest, bei dem jede der drei Grundfarben durch ihre Energieverteilungskurve beschrieben wurde
und alle Mischfarben als auf besondere Weise als "gewichtete Summe" dieser drei Grundfarben
festgelegt werden kann.
Das hört sich sehr nach RGB-Farbraum an, ist es aber nicht ganz. Man geht von einem sogenannten Normalbeobachter aus und hat festgelegt, was dieser Normalbeobachter als Blau, Rot und
Grün sieht (Primärvalenzen ). Diese Primärvalenzen entsprechen folgenden Wellenlängen:
Blau = 435,8 nm
Grün = 546,1 nm
Rot = 700 nm
In einem geeigneten Versuch, wurde mit vielen Beobachtern ein Farbvergleich durchgeführt.
Dabei wurden aus den drei festgelegten Primärvalenzen nacheinander die Farben des Spektrums erzeugt und mit dem natürlichen Spektrum verglichen. Die Anteile ( Intensitäten ) von R ,
G und B , die jeweils nötig waren , um bei den Beobachtern den passenden Farbeindruck zu erzeugen, wurden über den Wellenlänge aufgetragen und mit einigen mathematischen Transformationen erhält man eine Darstellung , die über alle Beobachter gemittelt ist und mit der man
nun für alle Spektralfarben eine Art Mischrezept hat, nach dem man die Farbe aus R, G und B
Seite 16
Farbwahrnehmung, CIE - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
zusammenstellen kann. Wichtig ! Das ist nicht der oben geschilderte RGB-Farbraum !
In den Verteilungskurven kann man nun für eine Wellenlänge des Spektrums ablesen, wie sie
aus den drei Primärvalenzen zu mischen ist.
Auf der y-Achse sind die sog. Tristimuluswerte aufgetragen, die angeben mit welchen Intesitätsanteilen die Primärvalenzen bei der jeweiligen Spektralfarbe wahrgenommen werden.
Wählt man etwa auf der x-Achse die Wellenlänge 470 nm aus, dann findet man etwa:
X = Wert in der xλ − Kurve = 0,2 Anteile
Y = Wert in der yλ − Kurve = 0,2 Anteile
Z = Wert in der zλ − Kurve = 1,35 Anteile
Auf diese Weise kann man die Mischrezepte tabellarisch erfassen, was aber keine besonders
gute Übersicht gibt. Klar ist auch, dass viele Farben, die nicht zum Spektrum gehören in dieser
Zusammenstellung der sogenannten Normalvalenzen noch nicht vorkommen.
Seite 17
Farbwahrnehmung, CIE - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Nun kann man aus den X, Y und Z-Werten einen dreidimensionalen Farbraum aufspannen oder
aber eine Normierung und Abbildung in den zweidimensionalen Raum vornehmen, den wir
ähnlich schon einmal beim RGB-Dreieck kennengelernt haben.
Die relativen Farbanteile x ( für Rot ) y ( für Grün) und z ( für Blau) ergeben sich, wie folgt:
x=
X
X+Y+Z
y=
Y
X+Y+Z
z=1-y-x
x und y werden als Koordinaten benutzt und so kann man für jede Wellenlänge λ die entsprechenden Koordinaten in einem Koordinatensystem festlegen. Es entsteht eine Linie, die die Lage
aller Spektralfarben wiedergibt.. Die Linie hat die Form eine halben Schuhsohle.
Dieses Diagramm macht nun weitere Mischfarben möglich. Zwischen zwei Punkten im Diagramm kann man sich eine Linie gezogen denken, auf der alle Mischungen liegen, die man aus
den beiden Ausgangswerten erzeugen kann. Schon die Linie zwischen dem 700 nm -Punkt und
dem 380 nm - Punkt , also zwischen Violett und Rot enthält dann alle Farben, die sich aus diesen
beiden Ausgangswerten bilden lassen. Es sind in diesem speziellen Fall Farben, die im natürlichen Spektrum nicht vorkommen. Sie bilden die sogenannte Purpurlinie.
Die so erzeugte x-y-Ebene nennt man die "Normfarbtafel". Alle Mischungen zweier Farben A
und B liegen auf der geradlinigen Verbindung zwischen A und B.
In der Mitte gibt es den "Unbuntpunkt" E, in dem die Farbanteile gleich sind ( Weiß). Die Zusammensetzung einer beliebigen Farbe in der Ebene kann man auf folgende Art ermitteln: Man
ziehe eine Linie von E durch den Ort der Farbe bis zum Rand der Kurve und findet dort eine
Wellenlänge. Im unten zu sehenden Beispiel sei das der Farbort C. Die Verbindungslinie endet
bei 590 nm. Dann wird die Farbe erzeugt durch diese Wellenlänge + eine anteiligen Beimischung
von Unbunt (Weiß).
Seite 18
Farbwahrnehmung, CIE - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
510
520
0,8
530
540
0,7
500
550
560
0,6
A
570
0,5
580
490
B
590
0,4
600
C
E
0,3
700
480
y
0,2
470
0,1
460
440
0
0
0,1
380
0,2
0,3
0,4
0,5
0,6
0,7
x
Ist z.B. das Verhältnis der Strecken E --> C zu C --> 590 nm = 3 : 2, dann mischt man:
Farbe von C : 2 Anteile Unbunt ( Weiß) + 3 Anteile der Spektralfarbe 590 nm.
Mathematisch gesehen, stellt die Normfarbtafel einen zweidimensionalen Schnitt durch den
X-Y-Z-Farbraum dar. Die dritte Dimension ist dabei nicht verschwunden. Man muss außer dem
geometrischen Ort (x,y) noch eine Helligkeitsangabe hinzufügen, um eine Farbe eindeutig festzulegen. Dazu wird im Allgemeinen der Y-Wert benutzt ( CIE Yxy - Modell ),weil der Grünanteil fast über den gesamten Wellenlängenbereich des Spektrums vertreten ist.
Dieses CIE-Farbmodell wurde 1976 noch einmal verbessert und ist heißt seither CIELAB-System.
Seite 19
Farbwahrnehmung, CIE - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Gamut für einen
Monitor
Gamut CMY
Gamut Pantone®
Aus den möglichen Farben in dieser Normfarbtafel können Geräte, wie Monitore oder Drucker
immer nur Teile darstellen. Die oben stehenden Darstellungen machen die Einschränkungen
deutlich.
Auch die Druckfarben nach dem CMYK-System decken also nur einen Teil des Normfarbraumes ab.
Besondere Druckfarbensysteme ( z.B. Pantone® ) haben dann wiederum einen größere Farbpalette als CYMK..
Solche Farbpaletten werden oft auch in den Darstellungen aus dem Normfarbraum "herausgeschnitten". Das ist schon etwas eigenartig, wenn in einem Buch ( mit CMYK gedruckt) ein Bild
der RGB - Monitorpalette erscheint und gleichzeitig im Text zu lesen ist, dass CMYK einen kleineren Farbraum hat , als der RGB -Monitor. Das sind aber Kompromisse, die man immer bei
der Darstellung von Farbpaletten am Bildschirm oder im Druck machen muss.
Seite 20
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Nach diesem kurzen Ausflug in die Theorie betrachten wir noch ein weiteres Farbmodell, das
oben schon einmal kurz angesprochen wurde, das HSB-Farbmodell.
Das HSB-Farbmodell
Wie schon erwähnt, kann eine Farbe auch über die Eigenschaften "Farbton","Sättigung" und
"Helligkeit" definiert werden.
Farbe
= HUE
Sättigung = SATURATION oder PURITY
Helligkeit = LUMINANCE oder BRIGHTNESS oder VALUE
Aus den Anfangsbuchstaben ergibt sich die Bezeichnung dieses Farbsystems zu HSV oder HSB.
Wenn man den RGB-Einheitswürfel (siehe oben ) entlang der Achse (0,0,0) zu (1,1,1) betrachtet,
120°
90°
60°
180°
0°
240°
300°
270°
Winkel
Farbe
0°
rot
60°
gelb
90°
gelb-grün
120°
grün
180°
cyan
240°
blau
270°
blau-violett
300°
magenta
360°
rot
erhält man in der zweidimensionalen Betrachtung ein Sechseck.
In diesem Sechseck wird die Farbe als Winkel angegeben, wobei Rot mit dem Winkel 0° gleichgesetzt wird.
Der Parameter Sättigung wird mit einem Wert zwischen 0 und 1 angegeben und ist durch den
Abstand vom Nullpunkt gekennzeichnet. Diese Angabe ist eigentlich nicht in Ordnung. Die
Randpunkte des Sechsecks haben offensichtlich nicht immer den gleichen Abstand von der Mitte. Das Sechseck besteht ja aus sechs gleichseitigen Dreiecken der Seitenlänge 1, aber ein Randpunkt P hat damit einen Abstand von der Mitte, der zwischen 0,5 ⋅ 3 und 1 liegt.
Dieses Problem wird noch einmal zu besprechen sein.
Der dritte Parameter kann in dieser nur 2 - dimensionalen Darstellung nicht gezeigt werden. Es
ist die Helligkeit. Man nimmt für die Helligkeit eine dritte Koordiantenachse hinzu. Um zu verstehen, wie Winkel, Abstand von der Mitte und Helligkeit zu einer Farbe führen sollen, muss
man sich noch einmal vor Augen führen, dass dieses Farbmodell aus den RGB-Farben abgeleitet
wird.
Seite 21
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Hat man eine Farbe mit den Werten r, g und b, dann wird die größte der drei Komponenten gesucht. Angenommen, es sei r >g und r > b. Dann wählt man den RGB-Würfel, der die Seitenlänge r hat . Da ja r zwischen 0 und 1 liegt, erhält man einen Würfel, der im RGB-Einheitswürfel
enthalten ist. Der Farbpunkt liegt dann auf einer der Seitenflächen dieses Würfels. Die Diagonale
im RGB-Einheitswürfel von (0,0,0) bis (1,1,1) geht auch durch die Diagonale dieses kleineren
Grün
1,1,1
b
0 ,0 , 0
r
g
Rot
Blau
Würfels. Nimmt man die Länge der Diagonale (0,0,0) bis (1,1,1) als Wert "1" für die Helligkeit,
dann entspricht die Länge der Diagonale im kleinen Würfel der Helligkeit für den Punkt mit
den Werten r,g und b. Auch hier liegt eine Fehlerquelle bei der Umrechnung, da ja die Diagonale im Würfel der Seitenlänge 1 die Länge √ 3 hat. Um nun diesen Farbwert im HSV-Modell darstellen zu können, muss dieser kleine Würfel wie oben beschrieben projiziert werden. Er bildet
dann auch ein Sechseck, das den Farbpunkt ( r,g,b) enthält und dazu alle anderen Punkte der
Oberfläche des kleineren Würfels.
So gibt es für jeden Helligkeitswert einen RGB-Würfel, dessen Darstellung als Sechseck möglich
ist. Dabei sind die Sechsecke mit kleinen Helligkeitswerten klein und das Sechseck mit der größten Helligkeit 1 ist das größte mögliche Sechseck.
Wird die Helligkeit B als dritte ( senkrechte ) Koordinatenachse verwendet, kann man alle diese
Sechsecke übereinander anordnen und erhält eine Farbpyramide. Die (unten liegende ) Spitze
der Pyramide bekommt den B-Wert Null ( für vollständig schwarz). Die Basis der Pyramide ist
das oben gezeigte Sechseck und bekommt den B-Wert 1 ( für vollständig Weiß ) in der Mitte der
Basisfläche.
Die Umrechnung der RGB-Farbwerte in HSV-Farbwerte ist offensichtlich nicht ganz einfach und
erfordert allerlei Geometrie. Besonders das Problem des Abstandes von der Mitte ( also des Wertes für S ) ist unangenehm. Man findet in der Literatur oft eine Kreisfläche für die Darstellung
Seite 22
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
B
B=1
Sättigung
Farbwinkel
B=0
des HSV-Modells. Das hat den Vorteil, dass der Abstand von der Mitte dann immer 1 ist.
In einem Modell, das die Farben zu einer bestimmten Helligkeit B in einer Kreisscheibe darstellt,
kann man auf große und kleine Sechsecke verzichten und erhält dann einen Farbzylinder, in
dem jede Kreisebene eine bestimmte Helligkeit hat ( ganz unten Helligkeit Null und damit eine
schwarze Fläche ). Innerhalb der Kreisfläche sind dann zu jedem Winkel H alle Werte der Sättigung von 0 bis 1 aufgetragen.
Zur Berechnung der RGB-Farbwerte, die zu vorgegebenen HSV-Werten gehören kann man ein
Programm bei "W.D. Fellner : Computergrafik" finden, das Umrechnungsformeln enthält, die
m.E. mit der Projektion in eine Sechsecksfläche nicht ganz zusammenpassen wohl aber mit der
Darstellung in einer Kreisfläche. Über Stahlensätze und Verhältnisgleichungen sind Umrechnungsformeln erzeugt worden, auf die hier nicht genauer eingegangen werden muss.
Auch passen die Bilder, die man in vielen Büchern zu HSV Modellen findet nicht zu der oben
geschilderten Darstellung der Achsen im RGB-Modell. Die Bilder sind um 90° oder 180° verdreht oder es fehlt die Komponente S .
Ein anderes Programm berücksichtigt diese Aspekte:
/*
HSB-Farbkreis mit Umrechnungsformeln nach Fellner
veränderet und in Java von H.-G.Beckmann 3/2002
*/
import java.awt.*;
import java.applet.Applet;
public class HSB extends Applet
{
Seite 23
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
double winkeldez,h;
int ii;
double rot,gruen,blau,hell=1;
double t1,t2,t3;
double fract;
int R,G,B,x,y;
int winkel,satt;
public void init()
{
// kann leer bleiben
}
public void paint( Graphics g )
{
for (satt=255;satt>0;satt--) //Sättigung in 255 Schritten vermindern 255 entspricht 1
{
for(winkel=0;winkel<360;winkel++) // Für alle Winkel die H ( also die Farbe ) annehmen kann
{
//**************************************************************************
// Zur Berechnung der Bildschirmkoordianten ist das Bogenmaß erforderlich
// Um der Position 0° = rot zu entsprechen hier 90° - Winkel
// 0.0174532 ist Pi / 180
//**************************************************************************
winkeldez=(90-winkel)*0.0174532; // Bogenmaß mit 90° Grad Korrektur
x=(int)(Math.sin(winkeldez)*satt);// Position am Bildschirm, Polarkoordinanten
y=(int)(Math.cos(winkeldez)*satt);
// Nun Farbe in RGB berechnen nach dem Programm von Fellner S. 40
h=winkel;
// h ist Farbwert
h=h/60;
// eine Dezimalzahl -- welches Sechseckssegment
ii=(int)h/1;
// der ganze Teil der Dezimalzahl
fract=h-ii;
// der Nachkommateil der Dezimalzahl
t1=hell*(1-0.0039*satt);
// Umrechnungsformeln
t2=hell*(1-0.0039*satt*fract);
// 0.0039 ist die Schrittweite in der Sättigung also 1/255
t3=hell*(1-0.0039*satt*(1-fract));
switch(ii)
// ii gibt an, in welchem Segment des RGB-Würfels die Farbe zu suchen ist
{
case 0: {rot=hell;gruen=t3;blau=t1;}break; // 0 .. 30 Grad entspr. der Außenfläche mit
// rot = konst.
case 1: {rot=t2;gruen=hell;blau=t1;}break; // 1 entspricht der Außenfläche mit
// Grün = konst.
case 2: {rot=t1;gruen=hell;blau=t3;}break; // usw
case 3: {rot=t1;gruen=t2;blau=hell;}break;
case 4: {rot=t3;gruen=t1;blau=hell;}break;
case 5: {rot=hell;gruen=t1;blau=t2;}break;
default:
} // Ende von switch ganz
// Jetzt für die Bildschirmdarstellung die Farbwerte berechnen
R=(int)(rot*256);
if(R>255) {R=255;}
if(R<0){R=0;}
G=(int)(gruen*256);
Seite 24
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
if(G>255) {G=255;}
if(G<0){G=0;}
B=(int)(blau*256);
if(B>255) {B=255;}
if(B<0){B=0;}
g.setColor(new Color(R,G,B));
g.fillArc(140-satt/2,140-satt/2,100+satt,100+satt,winkel,1); // Bogen zeichnen
}// Ende von for satt
} // Ende von for winkel
}
}
HSB-Modell ohne Sättigung
HSB-Modell mit Sättigung und B = 1
Man kann sich das Leben aber auch sehr viel einfacher machen, denn Java stellt Methoden zur
Umrechnung zwischen den Farbmodellen zur Verfügung !
Es gibt in der Klasse awt.Color die Methoden HSBtoRGB(float,float,float) die aus drei HSB-Angaben eine Integerzahl macht. Die Angaben für H,S und B müssen dabei zwischen 0 und 1 liegen.
Da der Konstruktor für ein neues Colorobjekt auch mit einer geeigneten Integerzahl arbeiten
kann, ist es direkt möglich, eine neue RGB - Farbe zu erzeugen.
Genauso gibt es die Methode RGBtoHSB, die drei ganzzahlige Werte annimmt und daraus einen
Array mit drei Dezimalzahlen erzeugt.
In unserem kleinen Javaprogramm lassen wir die Farbe H von 0 bis 360 laufen, die Sättigung S
von 0 bis 100 ( es könnten aber auch kleinere oder größere Schritte sein ) und die Helligkeit legen
wir auf den B=1 Wert 1 fest.
Zur Bestimmung der RGB-Farbe, die für die Bildschirmanzeige verwendet werden soll, nutzen
wir eine weitere Methode, die direkt ein neues Colorobjekt erzeugt:
getHSBColor(float, float,float);
Seite 25
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Dann kann man den ganzen Kernteil des Applets leicht ersetzen
Einige Variablen sind umbenannt worden. Der Winkel ist jetzt H, die Sättigung S und der für ein
Bild konstante Wert der Helligkeit sei B=100.
winkeldez=(winkel)*0.0174532;
// Bogenmaß OHNE 90 Grad Korrektur
x=(int)(Math.sin(winkeldez)*satt);// Position am Bildschirm, Polarkoordinanten
y=(int)(Math.cos(winkeldez)*satt);
// Nun Farbe in RGB bestimmen
g.setColor(Color.getHSBColor((float)H/360,(float)S/100,(float)B/100));
g.fillArc(140-satt/2,140-S/2,100+S,100+S,H,1); // Bogen zeichnen
Man sieht, dass nun der Text sehr viel kürzer geworden ist. Das Ergebnis entspricht dem korrigierten Bild oben.
Alle HSB-Kreise ergeben den erwähnten Zylinder, in dem die Helligkeit von unten nach oben
zunimmt.
Aus diesem Zylinder kann man nun senkrechte
Scheiben herausschneiden.
Die rechteckige Schnittfläche gehört zu einer
Farbe. In der Horizontalen nimmt die Sättigung
von 0 bis 1 zu, in der Vertikalen nimmt die Helligkeit von 0 bis 1 zu. Dieses Farbmodell wird
z.B. vom bekannten Programm Photoshop als
Farbwähler angeboten, obwohl das Programm
selbst mit RGB- Farben oder CMYK-Farben arbeitet.
Ein Screenshot(nächste Seite ) zeigt den
Photoshopfarbwähler für die Farbe 0° - also
Rot.
Seite 26
Farbwahrnehmung, HSB - Farbsystem
Virtuelle Lehrerfortbildung im
Fach Informatik in Niedersachsen
© Hans-Georg Beckmann 2004
Zum Abschluss der kleinen Farblehre:
Aufgabe:
Für die Umrechnung von RGB auf CMY gilt:
()
C
M
Y
=
=
=
()
1
1
1
–
–
–
()
R
G
B
Ändern sie das Applet "RGB-Mixer" in ein Applet "CMY-Mixer".
Seite 27