如果讓 用戶通過form上傳文字圖片，然后把整個form生成可下載的圖片？

1.上傳完圖片調(diào)回到頁面上，或者用FileReader()把本地要上傳的圖像文件變成DataUrl直接在頁面上展現(xiàn)

var input = document.getElementById("inputArea")
var imgData = input.files[0];
var reader = new FileReader(); //調(diào)用FileReader對象
reader.readAsDataURL(imgData); //通過DataURL的方式返回圖像
reader.onload = function(e) {
    var result = document.getElementById("result");
    result.innerHTML = '<img src="' + e.target.result + '" alt="" />';
}

2.將圖片和你要渲染出的文字用html排版成你想要的樣子
3.用html2canvas庫將你的頁面渲染成圖片就OK了

html2canvas(document.getElementById('image'), {
    onrendered: function(canvas) {
        var image = canvas.toDataURL("image/png");  
        $("#pic").html("<img src='"+image+"' alt='from canvas'/>")
    },
});

噫 這問題有意思，等待大牛的想法。

用canvas文字轉(zhuǎn)圖片
連接 http://www.sucaihuo.com/js/19...