利用canvas合并图片

function merger(imgs,maxWidth){
	if(!imgs) 
		return null;
	
	maxWidth = maxWidth || 500;
	
	var height = 0;
	for (var i = 0; i < imgs.length; i++) {
		var img = imgs[i];
		if (img.width > maxWidth) {
			height += img.height * (maxWidth / img.width);
			continue;
		}
		height += img.height;
	}
	
	var canvas = document.createElement("canvas");
	canvas.width = maxWidth+10;
	canvas.height = height+10;
	var ctx = canvas.getContext("2d");
	
	var dheight = 10;
	for (var i = 0; i < imgs.length; i++) {
		var img = imgs[i];
		var cheight = img.height;
		var cwidth = img.width;
		if (cwidth > maxWidth) {
			cwidth = maxWidth;
			cheight = img.height * (maxWidth / img.width);
		}
		
		ctx.drawImage(img, 10, dheight, cwidth, cheight);
		dheight += cheight;
	}
	
	
	var dataurl = canvas.toDataURL('image/png');
	return dataurl;
}

demo 只能在支持html5的浏览器查看哦....