1. The two-dimensional code
1.1 Introduction
Two-dimensional codes, also known as QR Code, QR stands for Quick Response, the device is a super popular in recent years, a mobile encoding, it is more than the traditional Bar Code barcodes can store more information, more data can be represented by Types of.
Dimensional bar code / two-dimensional code (2-dimensional bar code) is recorded with a pattern of black and white data symbols of a particular geometry according to certain rules in a plane (two-dimensional direction) distribution; clever in the preparation of the code utilize internal logic configured computer based "0", "1" concept bit stream, using the binary number corresponding to the geometry text numerical information represented by the image input device or optoelectronic scanning device to enable automatic reading automatic processing of information: it has some common bar code technology: each code system has its specific character set; each character occupies a certain width; checksum has a certain function. It also has a rotation change point information of automatic recognition of different lines, and process graphics.
1.2 Advantages
1) a large information capacity that can accommodate up to 1850 or 2710 uppercase letters or numbers more than 500 characters
2) a wide range of applications, support for text, sound, pictures, fingerprints and so on ...
3) Strong fault tolerance, even if the picture appears damaged part can also be used
4) low cost, easy to manufacture
1.3 two-dimensional code level of fault tolerance
Level L (low) 7% of the codeword can be recovered.
15% M-class (in) codeword can be recovered.
25% Q stage (quarter) of the codeword can be recovered.
30% H level (high) codeword can be recovered.
2. The two-dimensional code generation plug --qrious.js
Download: S2Lj
2.1 Introduction
qrious based on HTML5 Canvas is a pure JS two-dimensional code generation plug-in. qrious.js various two-dimensional code can be quickly generated by, you can control the size of the color two-dimensional code, the two-dimensional code may be generated also Base64 encoding.
Available configuration parameters 2.2 qrious.js plug
| parameter | Types of | Defaults | description |
| background | String | "white" | The background color two-dimensional code. |
| foreground | String | "black" | Foreground color two-dimensional code. |
| level | String | "L" | The two-dimensional code error correction level (L, M, Q, H). |
| mime | String | "image/png" | When the two-dimensional code output MIME type of a picture. |
| size | Number | 100 | Two-dimensional code size in pixels. |
| value | String | "" | We need to be encoded as the value of two-dimensional code |
2.3 demo Case
The qrious \ dist \ qrious.min.js umd files in your project to introduce it
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>demo</title>
<script src="qrious.min.js"></script>
</head>
<body>
<img id="qrious" />
<script>
var qr = new QRious(
{
element:document.getElementById('qrious'),
size:200,
level:'H',
value:'http://www.baidu.com'
}
);
</script>
</body>
</html>Generating a two-dimensional code as shown:
