javascript formule sepia

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Pepijn de vos

pepijn de vos

04/10/2008 21:52:00
Quote Anchor link
hallo

ik ben bezig een javascript te schijven dat de sepia tint van een kleur kan berekenen.
grijs is makkelijk, namelijk
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
color = ((R + G + B) / 3);

maar hoe gaat dit voor sepia?

ik heb nu iets van
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
return 'rgb(' + ((color + 25) < 255 ? (color + 25) : 255) + ', ' + ((color + 10) < 255 ? (color + 10) : 255) + ', ' + ((color - 35) > 0 ? (color - 35) : 0) + ')';

waar color de grijs waarde is.

het lijkt ergens op, maar volgens mij is dit niet echt sepia...
volgens wikipedia is sepia rgb(112, 66, 20), maar ik weet niet zo goed wat ik daar me moet, iets met procenten en verhoudingen gok ik?

Edit:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
return 'rgb(' + ((color * 1.6969) < 255 ? Math.round(color * 1.6969) : 255) + ', ' + color + ', ' + ((color * 0.3030) > 0 ? Math.round(color * 0.3030) : 0) + ')';

dit lijkt ook nergens op... nu heb je geen zwart en wit meer....
Gewijzigd op 01/01/1970 01:00:00 door Pepijn de vos
 
PHP hulp

PHP hulp

18/12/2024 07:07:17
 
- SanThe -

- SanThe -

04/10/2008 22:02:00
Quote Anchor link
sepia rgb(112, 66, 20) => #704214

color = ((R + G + B) / 3);
Dat komt neer op 'paars is even grijs als geel is even grijs als licht blauw'.
Gewijzigd op 01/01/1970 01:00:00 door - SanThe -
 
Pepijn de vos

pepijn de vos

04/10/2008 22:25:00
Quote Anchor link
santhe, nu ben je me ff kwijt... het gemiddelde van die 3 waardes is toch grijs? hoe maak je volgens jou dan de goede grijs?
ow wacht eens... een vriend zij eens dat er in een camera steeds een rode een blauwe en 2 groene cellen zitten, is het zo iets?

dat sepia #704214 is kan ik volgen, maar wat ben ik daar me geholpen?
een sepia foto gaat van zwart naar wit met daartussen licht sepia, sepia en donker sepia zal ik maar zeggen.
daar wil ik een kloppende formule voor vinden... en daar is nu een kloppende formule voor grijs bij gekomen.
 

04/10/2008 22:31:00
Quote Anchor link
Wil je nou de sepia kleur of zoals bij een oude foto?
 
- SanThe -

- SanThe -

04/10/2008 22:31:00
Quote Anchor link
Dat is mij in ieder geval nog niet gelukt.

color = ((R + G + B) / 3);
color = ((FF + FF + 00) / 3) => geel
color = ((FF + 00 + FF) / 3) => paars
color = ((00 + FF + FF) / 3) => licht blauw

Rekenkundig geven ze alledrie dezelfde uitkomst.
 
Pepijn de vos

pepijn de vos

04/10/2008 22:51:00
Quote Anchor link
karl, ik wil voor een gegeven kleur de sepia kleur berekenen alsof die kleur een pixel is in een sepia foto.

wikipedia: Adobe recommends setting Hue = 27 and Saturation = 21 and checking the Colorize box in the Hue/Saturation filter in Photoshop.

maar bij javascript heb je geen hue/saturation toch? dus ik zoek een manier om toch de kleur te 'verschuiven' naar sepia.

als we dat weten kunnen we wel wat experimenteren...
0, 0, 0 = 0, 0, 0
63, 63, 63 = 76, 62, 50 = +13, -1 -13
127, 127, 127 = 154, 125, 101 = +27, -2, -26
170, 170, 170 = 188, 169, 153 = +18, -1, -17
255, 255, 255 = 255, 255, 255

ik moet nog even denken wat ik daar nu aan heb hoor...

Edit:

ik heb het denk ik!!!
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
diff = (Math.abs(Math.abs(color - 127.5) - 127.5) / 4);
//alert(color +": "+ diff);
return 'rgb(' + ((color + diff) < 255 ? Math.round(color + diff) : 255) + ', ' + color + ', ' + ((color - diff) > 0 ? Math.round(color - diff) : 0) + ')';


nu alleen nog uitvinden wat er nou mis is met mijn grijs berekening....
Gewijzigd op 01/01/1970 01:00:00 door pepijn de vos
 
Jan Koehoorn

Jan Koehoorn

04/10/2008 23:44:00
Quote Anchor link
Dit is een PHP manier om grayscale te berekenen:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
<?php
    public function yiq ($r,$g,$b) {
        return (($r * 0.299) + ($g * 0.587) + ($b * 0.114));
    }

    
    public function to_grayscale ($grayfile) {
        list($width, $height) = getimagesize ($this->path);
        $src = imagecreatefromjpeg ($this->path);
        $dst= imagecreate ($width, $height);
        for ($c = 0; $c < 256; $c++) {
            $palette[$c] = imagecolorallocate ($dst, $c, $c, $c);
        }

        for ($y = 0; $y < $height; $y++) {
            for ($x = 0; $x < $width; $x++) {
                $rgb = imagecolorat ($src, $x, $y);
                $r = ($rgb >> 16) & 0xFF;
                $g = ($rgb >> 8) & 0xFF;
                $b = $rgb & 0xFF;
                
                //This is where we actually use yiq to modify our rbg values, and then convert them to our grayscale palette
                $gs = $this->yiq ($r, $g, $b);
                imagesetpixel ($dst, $x, $y, $palette[$gs]);
            }
        }

        imagejpeg ($dst, $grayfile, $this->jpg_quality);
    }

?>

Edit: hou er rekening mee dat deze functies bij mij in een class zitten. Je moet dus nog wat keywords aanpassen, zoals $this.
Gewijzigd op 01/01/1970 01:00:00 door Jan Koehoorn
 
Pepijn de vos

pepijn de vos

05/10/2008 10:41:00
Quote Anchor link
dit lijk sterk op een stukje dat ik eerder heb gezien, met al die bitwise operators.
de magie zit hem in de yiq denk ik he?
wat ik eigenlijk doe is ze allemaal door 0.333 delen, wat jij doet is net een andere verhouding, want die 3 getallen bij elkaar opgeteld is precies 1

ik neem aan dat je die getallen niet uit je duim hebt gezogen, hoe kom je daar aan?

als mijn javascript dingetje werkt ga ik misschien ook nog wel iets maken om plaatjes te doen met php en ajax.

Edit:

sorry, had ik toch bijna bij de 'te-lui-om-te-googelen' categorie behoort...
http://en.wikipedia.org/wiki/YIQ
Gewijzigd op 01/01/1970 01:00:00 door pepijn de vos
 
Rens nvt

Rens nvt

05/10/2008 10:58:00
Quote Anchor link
@pepijn: hier staat een stukje over omzetten naar sepia in C, de formules staan er netjes in. Misschien heb je er wat aan ;-)
http://blogs.techrepublic.com.com/howdoi/?p=120
 
Pepijn de vos

pepijn de vos

05/10/2008 11:28:00
Quote Anchor link
heel erg bedankt... alleen staat er bij grijs dit:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
outputColor = (inputRed + inputGreen + inputBlue) / 3
en dat was juist niet de bedoeling toch?

de methode voor sepia vind ik wel goed, ik had het allen mooier gevonden als er had gestaan
Quote:
If any of these output values is greater than 255, you simply set it to 255. These specific values are the values for sepia tone that are recommended by Adobe
inplaats van microsoft.....

Edit:

http://blogs.adobe.com/kevin.goldsmith/2007/10/writing_a_fadet_2.html
heeft nog een ander lijstje waardes... nog meer suggesties?
Gewijzigd op 01/01/1970 01:00:00 door pepijn de vos
 
Lode

Lode

05/10/2008 13:51:00
Quote Anchor link
Hier kan je 'm ook wel uithalen qua formule ^^
http://www.phphulp.nl/php/scripts/9/1297/
 
Pepijn de vos

pepijn de vos

06/10/2008 21:36:00
Quote Anchor link
bedankt allemaal, resultaat is hier te zien:
http://plugins.jquery.com/project/colorizer
 

06/10/2008 21:39:00
Quote Anchor link
pepijn de vos schreef op 06.10.2008 21:36:
bedankt allemaal, resultaat is hier te zien:
http://plugins.jquery.com/project/colorizer

Heb je demo?
 
Pepijn de vos

pepijn de vos

06/10/2008 22:00:00
Quote Anchor link
nee... ik moet echt eens een eigen site maken waar ik dit soort dingen op zet.
maar er zitten voorbeelden bij het project.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.