Javascript 16 bit matrix to bitmap image



8 Bit Matrix to Bitmap 16 Bit Matrix to Bitmap
Matrix:


Bitmap:


Click on a cell in the top table and it will add the bits that are on (red) up in the sum column on the right and turn the bit on in the bitmap below it.
Click again to turn the bit off (white.)

This is how bits are expressed on your computer, on its hard drive, in its RAM and ROM, and in its peripherals.

A collection of bits together is called a byte. The sum column on the right represents the value of a byte.
There are two important items to think about with regard to bytes and how they're interpreted.
  1. The size of the byte (how many bits make up a byte)
    • Typically these are expressed as powers of two from 2^3 (8 bits) on up to 2^6 (64 bits).
    • Knowing the size of the byte is important because getting it wrong means your interpretation of what a particular set of bits would be incorrect.
    • The byte's size in bits determines how many different values the byte can represent. It is always double the value of the Most Significant Bit (explained below.) Here it is the values from 0 to 65535, or 65536 total values.
  2. The byte's endianness.
    • Big Endian means when reading a string of bits from a byte that the MSB comes first.
    • Little Endian means when reading a string of bits from a byte that the LSB comes first.
    • MSB means "Most Significant Bit" and LSB means "Least Significant Bit".
    • Most significant means that the first bit read will have the highest value (here 32768) and least significant would have the lowest value(always 1). For simplicity's sake, our bitmaps will use the fairly standard MSB interpretation.

Teach your kids what it was like to design fonts and sprites back in the day.


wonkodsane.com