截圖生成圖片并保存到相冊
// 保存到相冊 $("#content").on("click", "#savepic", function () { $("#waitingupload").removeClass("heisebghid").addClass("heisebg"); // 調用html2canvas生成截圖 html2canvas($("#orderInfo")[0], { allowTaint: true, taintTest: false, onrendered: function (canvas) { canvas.id = "mycanvas"; //var newImg = document.createElement("img"); //newImg.crossOrigin = "*"; //var ctx = canvas.getContext("2d"); //ctx.drawImage(newImg, 0, 0); ////生成base64圖片數據 //var dataUrl = canvas.toDataURL(); //newImg.src = dataUrl; //document.body.appendChild(newImg); var dataUrl = canvas.toDataURL("image/png", 1); // 調用接口解碼,獲取圖片 getimgByBase64(dataUrl); } }); });
// Base64生成圖片 function getimgByBase64(base64code) { console.log(base64code); $.ajax({ type: "POST", url: configManager.RequstUrl + "api/common/base64decode", async: true, data: { "base64code": base64code } }).done(function (data) { if ("success" != data.state) { console.log(data.message); plus.nativeUI.alert("保存失敗!"); return; } // 保存到相冊 saveGallery(data.url); }); }
function saveGallery(url) { var dtask = plus.downloader.createDownload(url, {}, function (d, status) { // 下載完成 if (status == 200) { console.log(d.filename); var filepath = plus.io.convertLocalFileSystemURL(d.filename); console.log(filepath); // 保存相冊 plus.gallery.save(filepath); plus.nativeUI.alert("保存成功"); // 刪除 plus.io.resolveLocalFileSystemURL(filepath, function (entry) { entry.remove(function (e) { }, function (e) { }); }, function (e) { }); } else { plus.nativeUI.alert("Download failed: " + status); } $("#waitingupload").removeClass("heisebg").addClass("heisebghid"); }); //dtask.addEventListener( "statechanged", onStateChanged, false ); dtask.start(); }
html2canvas截圖js的介紹及下載地址如下:http://www.oschina.net/p/html2canvas
作者:Tyler Ning
出處:http://www.rzrgm.cn/tylerdonet/
本文版權歸作者和博客園共有,歡迎轉載,但未經作者同意必須保留此段聲明,且在文章頁面明顯位置給出原文連接,如有問題,請微信聯系冬天里的一把火
浙公網安備 33010602011771號