Toon posts:

[algemeen] algoritme voor contrasterende kleuren te krijgen

Pagina: 1
Acties:

Verwijderd

Topicstarter
Ik zoek achter een algoritme voor een "oneindig" (max 100 wel ofzo) aantal kleuren te krijgen die met elkaar contrasteren (ik bedoel niet allemaal met allemaal, maar 2 opeenvolgende kleuren moeten een duidelijk verschil tonen).

Dit is namelijk voor een soort van algemene pie-chart te maken... Daarvoor heb ik wel die kleurtjes nodig, maar ik zou begot niet weten hoe daar dat algoritme voor te schrijven.

Verwijderd

Wat leverde google op, en waarom was dat niet wat je zocht?

  • André
  • Registratie: Maart 2002
  • Laatst online: 19-08 12:30

André

Analytics dude

Pak de rgb waarden en check of ze groter of kleiner dan 128 (256/2) zijn. Als ze kleiner zijn doe je + 100 als ze groter zijn dan doe je -100.

Verwijderd

Topicstarter
google: niet echt iets (gezocht achter combinaties van 'algorithm multiple contrasting colors')

Ik denk dat daar een eenvoudige wiskundige formule voor bestaat, en dacht dat iemand dit hier zou weten... =x

  • RobIII
  • Registratie: December 2001
  • Niet online

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

(overleden)
Converteer de RGB waarden naar hex, en pak daarvoor waarden:

00, 33, 66, 99, CC, FF

Dus een kleur zou kunnen zijn 33CC66 of 0099CC

Dit zijn zo'n beetje de "webkleuren" en verschillen genoeg onderling denk ik zo. Je kunt ook per "stuk" van de pie de RGB waarden shiften ofzo:

0033CC
33CC00
CC0033

of zelfs zo:

3366FF
66FFCC
FFCC33
CC3300
33CC99

Dus gewoon 1 byte naar links shiften en rechts een nieuwe (random) kleur eraan plakken die iig verschilt met de waarde links ervan...

Ik wil wel effe een javascript voorbeeldje schrijven en hier posten...<maar ben ff pizza-tje eten>

[ Voor 16% gewijzigd door RobIII op 28-05-2003 19:37 ]

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij


Verwijderd

Topicstarter
Nee nee :) code is niet belangrijker ... Belangrijker is dat ik een weg weet waarop ik zou moeten beginnen denken ;)

Ik ben nue eventjes Rob3 aan't volgen ... Zijn nogal fletse kleurtjes (toch voor een chart, voor inet zijn die prima)

  • RobIII
  • Registratie: December 2001
  • Niet online

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

(overleden)
Verwijderd schreef op 28 May 2003 @ 19:41:
Nee nee :) code is niet belangrijker
... te laat ;)

HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<html>
<head>
    <title>Blaat</title>
    <STYLE>
        .Hokje {
            width   : 25px;
            height  : 25px;
            border  : 1 solid #000000;
            display : inline;
        }
    </STYLE>
    <script language="JavaScript">
        var arrCol = new Array();

        function dec2hex(n) {
            if (n!=0) { return(n.toString(16)) } else { return '00' };
        }

        function randColors() {
            var dv;
            
            //init array with random colors
            arrCol[0] = parseInt(Math.random() * 6)*51;
            newCol(1); newCol(2);
            
            //fill the 10 div's with random colors
            for (t=0;t<10;t++) {
                dv=document.getElementById('dv' + t);
                dv.style.backgroundColor='#' + dec2hex(arrCol[0]) + dec2hex(arrCol[1]) + dec2hex(arrCol[2]);
                shiftLeft();
            }
        }
        
        function shiftLeft() {
            //shift array left
            arrCol[0]=arrCol[1]; arrCol[1]=arrCol[2]; newCol(2);
        }
        
        function newCol(lPos) {
            //Make sure this color is different from it's left neighbour
            do {
                arrCol[lPos] = parseInt(Math.random() * 6)*51;
            } while(arrCol[lPos-1]==arrCol[lPos]);
        }
    </script>
</head>

<body>
    <p>
        <div id="dv0" class="hokje"></div>
        <div id="dv1" class="hokje"></div>
        <div id="dv2" class="hokje"></div>
        <div id="dv3" class="hokje"></div>
        <div id="dv4" class="hokje"></div>
        <div id="dv5" class="hokje"></div>
        <div id="dv6" class="hokje"></div>
        <div id="dv7" class="hokje"></div>
        <div id="dv8" class="hokje"></div>
        <div id="dv9" class="hokje"></div>
    </p>    
    <p><input type="button" onclick="randColors();" value="Kleur!"></p>

</body>
</html>


Maar je kunt de kleuren wat opfrissen op deze manier:

Regel 23:
HTML:
1
arrCol[0] = parseInt((Math.random() * 3)+3)*51;

Regel 42:
HTML:
1
arrCol[lPos] = parseInt((Math.random() * 3)+3)*51;


Maar dat zijn wel de "pastel" tinten ;)

edit:
Ik zou overigens misschien wel nog effe controleren of er geen dubbele kleuren in zitten, dat kan nu namelijk wel nog eens gebeuren (niet langs elkaar, maar wel "verderop")


Oh, screenshotje van 3 "runs" :
Afbeeldingslocatie: http://www.theforumisdown.com/uploadfiles/0103/randcol.gif

[ Voor 39% gewijzigd door RobIII op 28-05-2003 20:31 ]

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij


Verwijderd

Topicstarter
Mja, is niet echt belangrijk... Zolang het maar niet rood/groen/rood/groen/etc... is ;)
Is gewoon dat mensen een duidelijk verschil zien in de taart
Kzal die eens proberen in php te zwieren wat jij daar ongeveer voorstelde :)

echt wel zalige code man :)
thx!!!

[ Voor 9% gewijzigd door Verwijderd op 28-05-2003 21:20 . Reden: bedanking ]

Pagina: 1