Kanalseparation und Entfärbung von Tiles.

Wer sich das Anpassen des Stils zutraut und die richtigen Knöpfe im Grafikprogramm findet, kann dabei auch mithelfen: Die Textur entfärben und mir geben. Dabei sollte die Textur so hell wie unter Erhaltung der Struktur möglich sein, weil man sonst nach dem Mischen zu weit vom angegebenen Farbwert entfernt ist. Eventuell noch den Standardfarbwert anpassen, so dass er in Kombination mit der Textur sinnvoll aussieht.

Tordanik am 18.02.2013 im OSM-Forum

Also, die untere Schicht wären einfach entfärbte Ziegelsteine. Die Textur und der Farbwert sollten so sein, dass die Steine hinterher passen, der Mörtel ist wurscht.

In der zweiten Textur (als separate Datei) dann den Mörtel in seiner natürlichen Färbung und mit Transparenz (partielle oder vollständige Transparenz über Alphakanal der jeweiligen Pixel) dort, wo die Steine zu sehen sein sollen.

Tordanik am 18.02.2013 im OSM-Forum

MarekSeamlessBrick003.jpg

Versuchen wir den Ablauf doch einmal an der kachelbaren Ziegelmauer von marek kleciak.

Wir entscheiden uns für zwei Kanäle und lassen einen Vektor-Quantisierer aus allen Pixeln der Graphik die beiden heraussuchen, mit denen die Graphik am besten nachgebaut werden kann.

Wir erhalten: 56 2e 2e und a3 a4 8b.

Zu jeder der beiden Farben erzeugen wir eine Schwarz/Weiß-Masken-Graphik, in der die Pixel markiert sind, deren Farbton der jeweiligen Farbe am nächsten kommt:

Masken
Kanal 1 Kanal 2
mask1.png mask2.png

Mit diesen Masken zerlegen wir die Originalgrafik in zwei teiltransparente Auszüge, die übereinandergelegt – gleich in welcher Reihenfolge – wieder die Originalgraphik ergeben:

Maskierte Grafiken
Kanal 1 Kanal 2
masked1.png masked2.png

Die maskierten Graphiken werden ausgegraut. In einer echten Anwendung würde der Helligkeitsbereich auf den vollen Bereich von 0…255 gestreckt, um beim Zusammenfügen auch mit satten Farben eine hohe Helligkeit erreichen zu können. Darauf wurde hier verzichtet.

Ausgegraute Grafiken
Kanal 1 Kanal 2
uncolored1.png uncolored2.png

Die ausgegrauten teiltransparenten Graphiken sind zusammen mit ihren Basisfarben das Ergebnis des Algorithmus.


Zusammenbauen der Graphiken

Wir legen den Kanal 1 mit einer Opacity von 50% über eine massive Hintergrundfarbe und decken das Ergebnis mit dem ausgegrauten teiltransparenten Kanal 2 in Opacity 100% ab. Mit CSS-Bordmitteln können wir leider den unteren Layer nicht richtig und den oberen überhaupt nicht einfärben.

Original
(MarekSeamlessBrick003.jpg)
Ausgegraute Graphiken mit neuer Farbe kombiniert
(soweit mit CSS möglich)
MarekSeamlessBrick003.jpg

Sieht gar nicht mal so schlecht aus. ☺

Nutzung der Tiles in Kendzi3D:
colorable2.png colorable1.png