Bij binaire getallen berekenen, kijken we hoe vaak een bepaalde macht van 2 in ons decimale getal past. Met datgene wat er overblijft reken je dan verder.
Om dat te berekenen gebruikt een computer 2 functies.
Slide 3 - Tekstslide
DIV
DIV staat voor integer division. In plaats van de exacte uitkomst van een deling te geven, rondt het de uitkomst af naar het dichtstbijzijnde gehele getal dat kleiner is dan of gelijk aan het werkelijke resultaat.
Bij 10 DIV 3 is het resultaat 3, omdat 10 gedeeld door 3 gelijk is aan 3.33333333333333333333333333333333333 etc.
Maar dit wordt afgerond naar beneden naar het gehele getal 3
Niet te verwarren met DIV in HTML!
Slide 4 - Tekstslide
MOD
MOD staat voor de modulo-operator. Het resultaat van een MOD-operatie is het overschot van de deling. Bij een integer wil je een geheel getal.
Alles wat niet meer past, wordt 'rest' genoemd.
Bij 10 MOD 3 is het resultaat 1, omdat 10 gedeeld door 3 gelijk is aan 3 met een rest van 1. 3 past 3x in het getal 10. De rest, in dit geval 1, houd je over. Zo blijf je dus werken met gehele getallen.
Slide 5 - Tekstslide
Al die getallen
Afgelopen weken zijn we bezig geweest
met verschillende tal-stelsels
Uiteraard kennen we ons eigen decimale stelsel:
0 1 2 3 4 5 6 7 8 9
Slide 6 - Tekstslide
Al die getallen
En we kunnen ondertussen werken
met binaire getallen
00100111
Welk getal is dit decimaal?
Slide 7 - Tekstslide
Nog een talstelsel
Naast ons eigen decimale stelsel en het binaire stelsel werken computers met nóg een ander soort tal-stelsel:
Hexadecimaal
Slide 8 - Tekstslide
Nog een talstelsel
Bij hexadecimaal is de basis 16. Iedere positie in een hexadecimaal getal kan dus 16 verschillende waardes hebben.
Slide 9 - Tekstslide
Getalstelsels
Een decimaal getal van 2 posities kan maximaal
100 verschillende waardes hebben:
Het kleinste getal is: 00
Het grootste getal is: 99
Slide 10 - Tekstslide
Getalstelsels
Een binair getal van 2 posities kan maximaal
4 verschillende waardes hebben:
00
01
10
11
Slide 11 - Tekstslide
Getalstelsels
Een hexadecimaal getal van 2 posities kan maximaal
256 verschillende waardes hebben.
Iedere positie kan immers
16 verschillende "cijfers" zijn
Voor 2 posities geldt dus:
16 x 16 = 256 mogelijkheden
Slide 12 - Tekstslide
16 verschillende "cijfers".
Waarom staat cijfers tussen aanhalingstekens?
Wij kennen maar 10 verschillende cijfers (0 t/m 9) Om de 16 posities te kunnen vullen van een hexadecimaal getal, gebruiken we als notatie:
0 1 2 3 4 5 6 7 8 9 A B C D E F
Slide 13 - Tekstslide
Slide 14 - Tekstslide
codepen.io
Slide 15 - Link
Getalstelsels
Getalstelsel
Basis
Symbolen
Aantal symbolen
Maximale waarde 1 symbool
Decimaal
10
0 - 9
10
9
Binair
2
0 - 1
2
1
Hexadecimaal
16
0 - 9 A - F
16
15
Slide 16 - Tekstslide
Slide 17 - Tekstslide
Getalstelsels
10dec = 10
10bin = 2
10hex = 16
Slide 18 - Tekstslide
Hexadecimaal bij WEB
Zonder het misschien te weten ben je hexadecimale getallen wel eens tegengekomen. We gebruiken deze notatie namelijk voor de kleurcodes in HTML en CSS.
Slide 19 - Tekstslide
RGB - Red Green Blue
De kleuren op een beeldscherm worden
opgebouwd uit 3 kleuren
Rood
Groen
Blauw
Slide 20 - Tekstslide
RGB
#FF0000
#00FF00
#0000FF
Iedere positie kan 16 waardes hebben. Een HEX-getal van 6 posities kan dus
16 x 16 x 16 x 16 x 16 x 16 verschillende kleuren maken.
Slide 21 - Tekstslide
RGB
#FF0000
#00FF00
#0000FF
Dat zijn 16.777.216 mogelijkheden! Meer dan 16,5 miljoen kleuren!
Slide 22 - Tekstslide
RGB waardes worden in
het decimale getalstelsel weergegeven
als getallen tussen 0 en 255.
De hoeveelheid rood (R): 0 - 255
De hoeveelheid groen(G): 0 - 255
De hoeveelheid blauw(B): 0 - 255
Slide 23 - Tekstslide
www.w3schools.com
Slide 24 - Link
De RGB waarde van een kleur wordt opgeslagen in 3 bytes.
In 1 byte gaan 8 bits. We weten dat een binair getal van 8 posities,
maximaal 256 waardes kan hebben.
Slide 25 - Tekstslide
Kleurmodellen
RGB: Rood, Groen, Blauw. Wordt gebruikt voor beeldschermen
Bij het "mengen" van alle volledige kleuren krijg je wit
Staan alle bits op 0, krijg je dus zwart
Slide 26 - Tekstslide
De kleur wit in hexa & RGB
The hexadecimal color #ffffff
RGB values of 255, 255, 255
Slide 27 - Tekstslide
Decimaal naar hexadecimaal
Om de HEX waarde van een RGB waarde te bepalen
Zet de decimale RGB waarde eerst om naar binair. Daar hebben we inmiddels zelf een applicatie voor gemaakt!
Zet de binaire waarde om naar hex Dit kun je doen met de4-bits groepjes methode
Slide 28 - Tekstslide
Decimaal naar hexadecimaal
We hebben deze kleur:
rgb(42, 130, 90)
42 is binair: 00101010 130 is binair: 10000010
90 is binair: 01011010
Slide 29 - Tekstslide
Decimaal naar hexadecimaal
42 is binair: 00101010
Met 4 bits groepjes methode wordt dit:
Mijn CSS-kleurcode begint dus met: #2A
bin
0010
1010
dec
2
10
hex
2
A
Slide 30 - Tekstslide
Decimaal naar hexadecimaal
130 is binair: 10000010
Met 4 bits groepjes methode wordt dit:
Mijn CSS-kleurcode is nu: #2A82
bin
1000
0010
dec
8
2
hex
8
2
Slide 31 - Tekstslide
Decimaal naar hexadecimaal
90 is binair: 01011010
Met 4 bits groepjes methode wordt dit:
De totale CSS-kleurcode is: #2A825A
bin
0101
1010
dec
5
10
hex
5
A
Slide 32 - Tekstslide
Hexadecimaal naar decimaal
Omgekeerd werkt dat ook:
#FF9A0B
11111111bin = 255dec. R is dus 255
hex
F
F
dec
15
15
bin
1111
1111
Slide 33 - Tekstslide
Hexadecimaal naar decimaal
Omgekeerd werkt dat ook:
#FF9A0B
10011010bin = 154dec. G is dus 154
hex
9
A
dec
9
10
bin
1001
1010
Slide 34 - Tekstslide
Hexadecimaal naar decimaal
Omgekeerd werkt dat ook:
#FF9A0B
00001011bin = 11dec. B is dus 11
hex
0
B
dec
0
11
bin
0000
1011
Slide 35 - Tekstslide
Hexadecimaal naar decimaal
#FF9A0B
=
RGB (255, 154, 11)
Slide 36 - Tekstslide
Decimaal naar hexadecimaal
De4-bits groepjes methode werkt ook voor grotere getallen.