Generate a summary of the qr code method

  • 2020-05-09 18:06:40
  • OfStack

With the rapid development of the network, the application of 2 d code will be more and more. At the same time, many are just ordinary 2-d codes. Please pick up your hand and design this 2-d code. Here are some of the best 2d code designs.

Principle of 2d code:

2 - d barcode /2 - d codes can be divided into stacked/row 2 - d barcode and matrix 2 - d barcode. Stacking type/row type 2d bar code is formed by stacking multi-line truncated 1-d bar code; Matrix 2-d bar code is composed in the form of matrix. In the corresponding element position of matrix, "point" is used to represent "1" in base 2, and "empty" is used to represent "0" in base 2. The arrangement of "point" and "empty" constitutes the code.

Recently developed an interest in 2-dimensional codes and studied the 2-dimensional codes of 1 and the term qrcode   which comes out here has a high fault tolerance.

Data representation method

The dark module represents the base 2 "1" and the light module represents the base 2 "0".
Error correction ability
· L level: about 7% of data code words can be corrected
· M level: about 15% of data code words can be corrected
· Q level: can correct about 25% of data code words
· H level: about 30% of data code words can be corrected

The above design makes perfect use of the fault tolerance of qrcode, very nice   is also very creative!!

1. google interface


<?php
               $urlToEncode="http://www.csd2n.net";// To generate a 2 D code for the web site
               generateQRfromGoogle($urlToEncode);
               function generateQRfromGoogle($chl,$widhtHeight ='150',$EC_level='L',$margin='0')
               {
               $url = urlencode($url);
               echo '<img src="http://chart.apis.google.com/chart?chs='.$widhtHeight.'x'.$widhtHeight.'&cht=qr&chld='.$EC_level.'|'.$margin.'&chl='.$chl.'" alt="QR code" widhtHeight="'.$size.'" widhtHeight="'.$size.'"/>';//Google API Interface, if the failure can arrive Google Website query latest interface
               }
               ?>

2.. js code conversion to canvas (key)

demo: http://hxend.com/jsqrcode/test/


<script type="text/javascript" src="http://sandbox.runjs.cn/uploads/rs/142/gjxgxu0g/qrgen.min.js"></script>
               <div id=qrcode></div>
               <script type="text/javascript">
               qrcode(document.getElementById('qrcode'),{
                   data:'http://geraldl.net'
               });
               </script>

3. Picture interface


<img src="http://qrcoder.sinaapp.com?t=hello world">

4. demo http inside: / / hxend com/jsqrcode/test/code


<!doctype html>
<html>
    <head>
        <title>QRCode</title>
        <script type="text/javascript" src="http://files.cnblogs.com/webers/qrcode-light.js"></script>
        <script type="text/javascript" src="http://files.cnblogs.com/webers/qrgen.js"></script>
    </head>
    <body>
        <div>
            <h1>2 D code generated </h1>
            <div>
                The picture : <img id=qrimg src=//www.ofstack.com/uploadfile/2014/1219/20141219081025437.png>
                <label><input id=qrclearedges type=checkbox checked> Clean up the edge </label>
            </div>
            <div><input id=fimg type=file></div>
            <div> The text : <textarea id=qrtext>http://www.btgoogle.com</textarea></div>
            <div> The size of the : <input id=cellSize type=range min=2 max=10 value=6></div>
            <table>
                <tr>
                    <td rowspan=2> The effect :</td>
                    <td colspan=3><input id=cellEffect type=range min=-50 max=50 step=5 value=0></td>
                </tr>
                <tr id=cellEffectStops>
                    <td align=left><a href=# data=l> liquid </a></td>
                    <td align=center><a href=# data=s> square </a></td>
                    <td align=right><a href=# data=r> round </a></td>
                </tr>
            </table>
            <div>
                Foreground color: <input id=colorFore type=color value=#4169e1>
                Background color: <input id=colorBack type=color value=#ffffff><br>
                Outside-border color: <input id=colorOut type=color value=#cd5c5c>
                Inside-border color: <input id=colorIn type=color value=#191970>
            </div>
            <button id=qrgen> generate </button>
        </div>
        <div id=qrcode></div>
        <script src="http://files.cnblogs.com/webers/take.js"></script>
    </body>

The above four methods, the third is the most simple, the second is I recommend, more freedom, partners according to their own needs to choose it


Related articles: