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中的数据类型主要分为两大类:原始类型(值类型)和引用类型.常见的数据类型 ...
随机推荐
- 【转】使用VisualSVN Server搭建SVN服务器
http://blog.csdn.net/han_yankun2009/article/details/7856992 使用 VisualSVN Server来实现主要的 SVN功能则要比使用原始的 ...
- Win8启用便签
启动或显示 Sticky Notes : Win+R--->StikyNot.exe 备份Sticky Notes保存位置 : %AppData%\Microsoft\Sticky Notes\ ...
- $GLOBALS['HTTP_RAW_POST_DATA'] 和$_POST的区别(转)
---恢复内容开始--- $_POST:通过 HTTP POST 方法传递的变量组成的数组.是自动全局变量. $GLOBALS['HTTP_RAW_POST_DATA'] :总是产生 $HTTP_RA ...
- google perftools分析程序性能
Google perftools 1.功能简介 它的主要功能就是通过采样的方式,给程序中cpu的使用情况进行“画像”,通过它所输出的结果,我们可以对程序中各个函数(得到函数之间的调用关系)耗时情况一目 ...
- Cookie中用户登录信息的提示
public class LoginServlet extends HttpServlet { public void doGet(HttpServletRequest request, HttpSe ...
- C# Obsolete
Obsolete 属性将某个程序实体标记为一个建议不再使用的实体.每次使用被标记为已过时的实体时,随后将生成警告或错误,这取决于属性是如何配置的 如果把false 改成 true 的话那么GetNam ...
- VS的一部分快捷键
快捷键 功能CTRL + SHIFT + B 生成解决方案CTRL + F ...
- Java8特性---关于Null
为了防止无良网站的爬虫抓取文章,特此标识,转载请注明文章出处.LaplaceDemon/SJQ. http://www.cnblogs.com/shijiaqi1066/p/5713941.html ...
- linux-ssh远程后台执行脚本-放置后台执行问题（转）
写了一个监控负载的小脚本(死循环,测试结束后再kill对应进程),因需要监控多台服务器,所以在一台服务器上使用ssh统一执行脚本遇到问题:使用ssh root@172.16.146.20 '/usr/ ...
- jQuery多图上传Uploadify插件使用及传参详解
因为工作需要,这两天接触到了Uploadify插件,由于是第一次用,花了我近一天的时间.下面我把我在用这个插件过程详细的分享出来,也让自己巩固一下,也希望能帮助到你. 所需文件: jquery-1.8 ...