- // 需要引用 html2canvas.js 和 jspdf.js
- SavePDF: function(e) {
- var that = this;
- $.post("/Biz/DailyExpenseApply/GetpictureToPDF?expenseApplyId=" + this.expenseApply.ExpenseApplyID,
- function(res) {
- _.each(res,
- function(m) {
- getBase64(m.FileUrl, (dataURL) = >{
- debugger
- // 三个参数, 第一个方向, 第二个单位, 第三个尺寸格式
- var doc = new jsPDF(landscape, pt, [205, 115])
- // 将图片转化为 dataUrl
- var imageData = dataURL;
- doc.addImage(imageData, PNG, 0, 0, 205, 115);
- doc.save(m.DOCNAME + .pdf);
- //var base64str = doc.output("datauristring");
- });
- })
- })
- },
- function getBase64(url, callback) { // 获取图片 url 的地址转换成 base64
- // 通过构造函数来创建的 img 实例, 在赋予 src 值后就会立刻下载图片, 相比 createElement() 创建 <img> 省去了 append(), 也就避免了文档冗余和污染
- var Img = new Image(),
- dataURL = ;
- Img.src = url;
- Img.onload = function() { // 要先确保图片完整获取到, 这是个异步事件
- var canvas = document.createElement("canvas"),
- // 创建 canvas 元素
- width = Img.width,
- // 确保 canvas 的尺寸和图片一样
- height = Img.height;
- canvas.width = width;
- canvas.height = height;
- canvas.getContext("2d").drawImage(Img, 0, 0, width, height); // 将图片绘制到 canvas 中
- debugger dataURL = canvas.toDataURL(image / jpeg); // 转换图片为 dataURL
- callback ? callback(dataURL) : null; // 调用回调函数
- };
- }
来源: http://www.bubuko.com/infodetail-2540402.html