Image and Base64 conversion relationship

1. Noun explanation

1.1 pixels

Pixel: the smallest unit in an image represented by a sequence of numbers, the basic unit, which is not separable. In the picture, it is represented as a small square, containing color and position information.

1.2 the resolution

1.2.1 Display resolution

The resolution of the display image. It refers to the number of pixels that can be displayed on a display, usually multiplied by the number of pixels per row by the number of pixels per column.

For example, 1024 x 768 indicates that the display can display 768 rows and 1024 columns, and a total of 786432 pixelsCopy the code

The total number of horizontal and vertical pixels for the display resolution is always proportional, typically 4:3, 5:4, or 8:5.

On a screen of the same size, the higher the resolution, the smaller the display. When the screen size is fixed, the pixel value changes somewhat with the resolution, but the number of pixels that the font and ICONS themselves depend on is the same, so the physical width of each pixel on the screen becomes larger/smaller. The more pixels there are, the smaller the actual width and height of the screen each pixel takes up, the more coherent and the better the quality is, otherwise it will be a full-screen Mosaic.

1.2.2 Image resolution

Image resolution refers to the amount of information stored in the image, which is the number of pixels per inch of the image. The concept of image resolution is more akin to the definition of the three-word noun resolution itself.

1.3 the bitmap

A bitmap image, also known as a lattice image or raster image, is made up of individual points called pixels (image elements).

2. Image size calculation

2.1 Approximate calculation formula

For example, if the resolution of a 24-bit image is 1024 x 768 x 24, the image size can be calculated as follows: Image size =1024 x 768 x 24 = 2359296byte / 8 = 2304KB

Bit depth: The number of bits of color used in each pixel. (1 byte =8 bits)

Common bit depths are 1, 4, 8, 16, 24 and 32 bit images

Here are two examples of what bit-depth means

1. A binary plot with a bit depth of 1

A binary image is a black and white image, and each pixel has a color depth of only 1 bit, which means the values are only 0 and 1.

2. Often called RGB24 bitmap

RGB24 bitmap is called true color image, is composed of 3 channels, respectively red, green, blue. The color of each pixel in the RGB diagram is composed of three colors. Each pixel may have 2^(8*3) colors, which is a picture composed of spatial stereo.

Popular speak be a three layers of paper pressed together, as is shown above, a total of three layers of channels, such as the layer of the grey value of red is very large (the grey value, the greater the more bright color), green and blue grey value, then together is red, if there is a certain grey value, green and blue, together pure red would be affected by other colors, forming a new naked eye can see color. There are three channels in the true color map, and each channel (i.e., red, green, and blue) needs 8 bits to display its own color, so the RGB24-bit true color map needs 24 bits in total to express the color of each pixel value, so the bit depth is 24.

Base64 and image stream size conversion

3.1 Base64 codec principles

First of all, we need to know that image conversion to Base64 is not encryption and decryption, but codecs, the main function is not security, but to let the content between the gateway error-free transmission, this is the core role of Base64 encoding.

3.1.1 Base64 Encoding Principles

Base64 encoding is based on the 64 characters a-z, A-z, 0-9, +, /, because 2 ^ 6 is exactly 64, so the 64 characters can be represented in 6 bits. A byte is 8 bits, and 6 bits can express 64 characters, so take 3 characters (3*8 =24 bits) to make up 24 bits, and then convert the 24 bits into 4 6-bit characters, and then fill in two high-order zeros before each byte to form 4 new characters.

Encoding process: Take 3 characters as a group, and then for each group, first get the ASCII encoding of each character (character ‘a’=97=01100001), then convert the ASCII encoding into 8bit binary, and get a group of 3*8=24bit bytes. Then divide the 24 bits into four 6-bit bytes and fill two high-order zeros before each 6-bit byte to get four 8-bit bytes. Then convert the four 8-bit bytes to decimal

3.1.2 Base64 Decoding Principles

(1) First remove the equal sign;

(2) According to the encoding table, find the encoding value corresponding to the encoding character;

(3) Take the 8-bit binary value of each coding value, remove the first 2 bits of 0 value of each binary, and then connect to form binary string;

(4) For the above binary string, from front to back, every 8 bits constitute one byte of data; Remove redundant trailing zeros;