4种方法生成二维码 （js 控制canvas 画出 二维码）
随着网络的迅速发展 发展 发展，二维码的应用将会越来越多。同时很多只是很平凡的二维码，请拿起你的手 把这个二维码 设计起来吧。下面分享了几个非常好的二维码设计。
二维码原理：
二维条码/二维码可以分为堆叠式/行排式二维条码和矩阵式二维条码。 堆叠式/行排式二维条码形态上是由多行短截的一维5条码堆叠而成；矩阵式二维条码以矩阵的形式组成，在矩阵相应元素位置上用“点”表示二进制“1”， 用“空”表示二进制“0”，“点”和“空”的排列组成代码。
最近对二维码产生了兴趣 研究了一下二维码 这里生出的术语 qrcode 容错性较高。
|
数据表示方法
|
深色模块表示二进制“1”，浅色模块表示二进制“0”。
|
|
纠错能力
|
· L级：约可纠错7%的数据码字
|
|
· M级：约可纠错15%的数据码字
|
|
|
· Q级：约可纠错25%的数据码字
|
|
|
· H级：约可纠错30%的数据码字
|
上面的设计 就很完美的利用了 qrcode的容错性，非常nice 也非常有创意！！
1.google 接口
<?php
$urlToEncode="http://www.csd2n.net";//要生成二维码的网址
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接口，若失效可到Google网址查询最新接口
}
?>
<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>
<img src="http://qrcoder.sinaapp.com?t=hello world">
<!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>二维码生成</h1>
<div>
图片: <img id=qrimg src=http://hdimg.qiniudn.com/Uploads/141889425189.png>
<label><input id=qrclearedges type=checkbox checked>清理边缘</label>
</div>
<div><input id=fimg type=file></div>
<div>文本: <textarea id=qrtext>http://www.btgoogle.com</textarea></div>
<div>大小: <input id=cellSize type=range min=2 max=10 value=6></div>
<table>
<tr>
<td rowspan=2>效果:</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>液体</a></td>
<td align=center><a href=# data=s>方块</a></td>
<td align=right><a href=# data=r>圆</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>生成</button>
</div>
<div id=qrcode></div>
<script src="http://files.cnblogs.com/webers/take.js"></script>
</body>
</html>
4种方法生成二维码 （js 控制canvas 画出 二维码）的更多相关文章
- 教你用开源 JS 库快速画出 GitHub 章鱼猫
本文作者:HelloGitHub-kalifun 在上一篇文章我们介绍了 Zdog 如何使用,接下来这篇文章我将带领各位利用 Zdog 画出一个 GitHub 章鱼猫(和官方的还是有些差别的). Zd ...
- 动态生成二维码并利用canvas合成出一张图片(类似海报、分享页)
在前端开发并打算推广一个APP的时候,推广页是免不了的,而推广页的展示方式一般是给人家一个二维码,让别人自己去安装APP,这样前段任务也达到了,这次写这篇文章的原因主要还是总结一下,其中有很多不完善的 ...
- 实现网页页面跳转的几种方法大全(meta标签、js实现、php实现)
1.meta标签实现 只需在head里加上下面这一句就行了,在当前页面停留0.1秒后跳转到目标页面 代码如下 复制代码 1 <meta http-equiv="refresh&quo ...
- 两种PHP生成二维码的方法
PHP生成二维码,个人认为最常用的有两种,1.使用google的api生成,2.使用PHP QR Code生成,两种方法生成的二维码都是很清淅的,效果不错.下面来分别说明这两种方法如何实现. 一.PH ...
- 四种Sandcastle方法生成c#.net帮助类帮助文档
方法一 前端时间在网上收集和自己平时工作总结整理了<干货,比较全面的c#.net公共帮助类>,整理完成上传github之后我又想,既然是帮助类,总得有个帮助文档于是乎想到了Sandcast ...
- 百度地图和高德地图坐标系的互相转换 四种Sandcastle方法生成c#.net帮助类帮助文档 文档API生成神器SandCastle使用心得 ASP.NET Core
百度地图和高德地图坐标系的互相转换 GPS.谷歌.百度.高德坐标相互转换 一.在进行地图开发过程中,我们一般能接触到以下三种类型的地图坐标系: 1.WGS-84原始坐标系,一般用国际GPS纪录仪记 ...
- url地址数据参数转化JSON对象（js三种方法实现）
当我们用get方法提交表单时,在url上会显示出请求的参数组成的字符串,例如:http://localhost:3000/index.html?phone=12345678901&pwd=12 ...
- 应对加密js的三种方法
经常遇到网页在登录后会对用户输入的帐号和密码通过js进行加密,导致模拟登录这类网站时受到阻碍 这里小记一下当前解决该问题的三种方法 1.利用python实现js同等加密. 2.利用selenium模拟 ...
- JS做类型检测到底有几种方法？看完本文就知道了！
JS有很多数据类型,对于不同数据类型的识别和相互转换也是面试中的一个常考点,本文主要讲的就是类型转换和类型检测. 数据类型 JS中的数据类型主要分为两大类:原始类型(值类型)和引用类型.常见的数据类型 ...
随机推荐
- MySQL参数优化
目前针对MySQL数据库进行了一些参数优化,具体如下: my.ini / my.cnf 参数说明 #使用查询缓存 query_cache_size=100M # ...
- 安装SQL Server提示“重叠的IO操作正在进行”解决
单位新做了一个虚机.打算部署一套.Net SQL 的系统 系统是Server 2008 R2,机器除了系统,其它软件都没有. 所以须要安装SQL Server啊,.Net环境啊.配置IIS== 恰巧的 ...
- L2TP
点击查看详情>> 我的贡献 |退出 L2TP 编辑词条 L2TP是一种工业标准的Internet隧道协议,功能大致和PPTP协议类似,比如同样可以对网络数据流进行加密.不过也有不同之处 ...
- jAVA HDU1001题
import java.util.Scanner;public class Main { public static void main(String args[]) { Scanner cin=ne ...
- Android（java）学习笔记142：使用Sqlite基本流程
- rndc: connect failed: 127.0.0.1#953: connection refused
[root@localhost sbin]# ./named -v bind 9.5.1-p3-v3.0.9 问题现象: [root@localhost sbin]# ./rndc flush -p ...
- Python之路【第二十一篇】：Django之Form组件
Django之Form组件 Django的Form主要具有一下几大功能: 生成HTML标签 验证用户数据(显示错误信息) HTML Form提交保留上次提交数据 初始化页面显示内容 小试牛刀 1. ...
- JQ判断按钮,复选框是否选中
var oRdoValue=$("#Radio1").is (":checked")?"男":"女"; //获取单选框按 ...
- zigbee
IEEE802.15.4定义了两种器件:全功能器件(FFD,Full-FunctionDevice),和简化功能器件(RFD,Reduced-functionDevice) 协调器:(coordina ...
- 封装一个ISortable接口
using System;/// <summary>/// 排序规范/// </summary>/// <typeparam name="T"> ...