Erstelle einzigartige Farben

Question

Ich möchte einige Daten in eine Textur zeichnen: viele Elemente in einer Reihe. Sie werden nicht in der richtigen Reihenfolge erstellt, und sie können alle unterschiedlich groß sein (denken Sie an einen Speicher-Heap). Jedes Datenelement ist ein kleines Rechteck und ich möchte sie voneinander unterscheiden können, daher möchte ich, dass jede einzelne eine eindeutige Farbe hat.

Jetzt könnte ich nur Rand() verwenden, um RGB-Werte zu generieren und hoffe, dass sie alle unterschiedlich sind, aber ich vermute, dass ich keine gute Verteilung im RGB-Raum bekommen werde. Gibt es einen besseren Weg als das? Z.B. Was ist eine gute Art, durch verschiedene Farben zu radeln, bevor sie (fast) sich wiederholen?

Die Farben müssen nicht mit Daten in den Elementen übereinstimmen. Ich möchte einfach viele Werte betrachten und sehen können, dass sie verschieden sind, da sie benachbart sind.

Ich könnte etwas herausfinden, aber ich denke, das ist eine interessante Frage. :)

Answer 1

Die Verwendung des RGB-Farbmodells ist kein guter Weg, um eine gute Farbmischung zu erhalten. Es ist besser, ein anderes Farbmodell zu verwenden, um Ihre Farbe zu generieren, und dann von diesem Farbmodell in RGB zu konvertieren.

Ich empfehle Ihnen stattdessen das HSV or HSL Farbmodell, insbesondere möchten Sie die Hue variieren.

Wenn Sie X wollen unterschiedliche Farbwerte, variieren sie von 0 bis 360 mit einer Schrittweite von 360 durch X geteilt

Answer 2

Was ist Ihr Raum Probe ... wie viele Elemente reden wir.

Sie könnten eine Reihe von RGB-Triples von

for(int r = 0; r < 255; r = r+16) 
    for(int g = 0; g < 255; g = g+16) 
     for(int b = 0; b < 255; b = b+16) 
      // take r, g, b and add it to a list 

Dann randomise Ihre Liste aufzubauen und durchlaufen. das würde Ihnen 16^3 (4096) verschiedene Farben vor einer wiederholten Farbe geben.

Answer 3

Im Allgemeinen RGB ist kein großer Farbraum für diese Art von Dingen, weil es für den Anfang wahrnehmbar nicht linear ist. Das bedeutet, dass gleiche Entfernungen zwischen RGB-Triplets nicht gleich aussehen.

Ich würde wahrscheinlich in der L*c*h* Raum (see also) Raum arbeiten, oder HSL Raum, und erzeugen Sie einfach einen einheitlichen Abstand in Farbton. Diese Räume wurden so entworfen, dass sie ungefähr perzeptuell linear sind.

Answer 4

Dies ist sehr ähnlich wie die Vier-Farben-Problem Färbung Karten beziehen, könnte dies einige interessante Lösungen für Sie ergeben:

Four colour theorem

Answer 5

Google "Delta e cie 2000"; Die Farbdifferenzformel ist nützlich, um den scheinbaren (visuellen) Abstand zwischen zwei Farben zu bestimmen. (Auf einem Monitor; es gibt eine andere Formel für Pigmente.) Es arbeitet mit Farben im Laborraum (Requisiten für Simon), wendet aber eine Wahrnehmungsberechnung der Differenz an.

Wir fanden, dass eine Zahl um 1,5 ausreichte visuell deutliche Farben zu gewährleisten (dh Sie den Unterschied erkennen können, wenn sie in der Nähe von einander sind), aber wenn Sie identifizierbare Farben wollen (Sie irgendeine Farbe finden in eine Legende), musst du das nachholen.

Zum Erstellen einer Reihe von Farben ...Ich würde wahrscheinlich an einer Ecke des Lab-Bereichs beginnen und mit einer Schrittgröße umgehen, die groß genug visuelle Unterschiede bietet (Anmerkung: es ist nicht linear, also muss die Schrittgröße wahrscheinlich adaptiv sein) und dann die Liste zufällig verteilen.

Answer 6

Wenn Sie nur einen Satz von wahrnehmungs verschiedenen Farben (und nicht ein Algorithmus zum Erzeugen sie) muss ich ein kostenloses Tool auf meiner Website erstellt haben, die genau das tut:
http://phrogz.net/css/distinct-colors.html

Statt nur der Verwendung selbst Abstand im RGB- oder HSV-Raum (die nicht gleichmäßig in Bezug auf die menschliche Wahrnehmung verteilt sind) ermöglicht es Ihnen, ein Raster von Werten im HSV-Raum zu erzeugen und verwendet dann den CMC(I:c)-Standard für die Farbentfernung, um wahrnehmbar zu nahe liegende Farben zu entfernen zueinander. (Mit dem Schieberegler "Schwellenwert" auf der zweiten Registerkarte können Sie steuern, wie deutlich die Farben sein müssen, um die Ergebnisse in Echtzeit anzuzeigen.)

Am Ende können Sie die Liste der generierten Farben nach verschiedenen Kriterien sortieren. und dann "shuffle" diese Liste gleichmäßig, so dass Sie garantiert visuell unterschiedliche Werte nebeneinander in der Liste haben. (Ich empfehle einen "Interleave" -Wert von etwa 5).

Zum jetzigen Zeitpunkt funktioniert das Tool gut mit Chrome, Safari und (über ein Shim) Firefox; IE9 unterstützt keine Eingabeslider für den HTML5-Bereich, die von der Benutzeroberfläche intensiv für die interaktive Exploration verwendet werden.