通过Google Chart API生成QR code

QR code ，Quick Response code，是一种流行的2维条形码，能够存储多达4296个字母数字字符的任意文本，对于汉字，做多存储1817个，相对于177x177这么小一块区域来说容量已经相当高，更重要的是读取速度——准确而高效，因而在各个领域都有非常广泛的应该。导致现在手机读取条码软件也是相当流行。

Google Chart API 里就有专门的 QR code 生成调用 ，能非常方便的获取自己想要的 QR code。配图的内容为 swordair.com，长宽为150px，由google生成，看起来还挺不错挺蛋疼的。 如果只是随便玩一下，网络上也有在线的QR code 生成工具，使用起来更加便捷。

问题在于，我们拿着这幅自己完全看不懂的图做什么？用来写情书吗？恐怕是个不错的主意，绕这么多圈子想不收卡都难了，哈哈。

难得闲来无事，对此API我就简单封装了一个QRcode.js，方便日常使用。好吧，我常常写情书，而且一写就停不下来:)

当然，卡也就没少收了...

/**
 * generate QR Code images using Google Chart API
 * developed by iifksp@swordair.com
 * http://www.swordair.com
 * api docs: http://code.google.com/apis/chart/image/docs/gallery/qr_codes.html
 */
var QRcode = function (config) {
	this.cfg = {
		container_id : '',
		/* The data to encode,  2K maximum length */
		data : '',
		/* Image size, QRcode is a square */
		size : 150,
		/* Error Correction Level
		L - [Default] Allows recovery of up to 7% data loss
		M - Allows recovery of up to 15% data loss
		Q - Allows recovery of up to 25% data loss
		H - Allows recovery of up to 30% data loss */
		ec_level : 'L',
		/* The width of the white border around the data portion of the chart.
		This is in rows, not in pixels. */
		margin : 4,
		/* How to encode the data in the chart */
		encode : 'UTF-8'
	}

	this.init(config);

	this.api_url = 'http://chart.apis.google.com/chart';
	this.param = {
		cht : 'qr',
		chs : this.cfg.size + 'x' + this.cfg.size,
		chl : encodeURIComponent(this.cfg.data),
		choe : this.cfg.encode,
		chld : this.cfg.ec_level + '|' + this.cfg.margin
	}

	this.qrcode_img_src = '';
	this.generateQRcode();
};

QRcode.prototype = {

	init : function (config) {
		for(var opt in config){
			this.cfg[opt] = config[opt];
		}
	},

	generateQRcode : function () {
		if(this.cfg.data == ''){
			return;
		}else{
			this.qrcode_img_src = this.api_url + '?' + this.joinParam();
		}
	},

	display : function (id) {
		var container_id = id ? id : this.cfg.container_id;
		if(container_id == '' ||
		!document.getElementById(container_id)){
			return;
		}else{
			var container = document.getElementById(container_id);
			var img = document.createElement('img');
			img.src = this.qrcode_img_src;
			container.appendChild(img);
		}
	},

	joinParam : function(){
		var quary = [];
		for(var opt in this.param){
			quary.push(opt + '=' + this.param[opt]);
		}
		return quary.join('&');
	}
};

使用上就是简单的实例化和显示，时间挺仓促，可能还有不完备的地方，以后再继续改进。

var qrcode = new QRcode({
	size : 150,
	data : 'swordair.com',
	container_id : 'container'
});
qrcode.display('other_container');