html2canvas图片的文字偏移,html2canvas html截图插件图片放大清晰度解决方案，支持任意放大倍数，解决原插件图片偏移问题...

html2canvas html截图插件图片放大清晰度解决方案，支持任意放大倍数，解决原插件图片偏移问题

Author:youzebin (2016.12.6)

插件下载地址：https://github.com/niklasvh/h…

1.首先引入html2canvas.js html2canvas 0.5.0-beta4 最新版即可

必要步骤1：修改插件的源码： (修改的地方有两处)

1. 代码第 999 行 renderWindow 的方法中 修改判断条件 增加一个options.scale存在的条件：

源码：

if (options.type === "view") {

canvas = crop(renderer.canvas, {width: renderer.canvas.width, height: renderer.canvas.height, top: 0, left: 0, x: 0, y: 0});

} else if (node === clonedWindow.document.body || node === clonedWindow.document.documentElement || options.canvas != null) {

canvas = renderer.canvas;

} else {

canvas = crop(renderer.canvas, {width: options.width != null ? options.width : bounds.width, height: options.height != null ? options.height : bounds.height, top: bounds.top, left: bounds.left, x: 0, y: 0});

}

改为：

if (options.type === "view") {

canvas = crop(renderer.canvas, {width: renderer.canvas.width, height: renderer.canvas.height, top: 0, left: 0, x: 0, y: 0});

} else if (node === clonedWindow.document.body || node === clonedWindow.document.documentElement) {

canvas = renderer.canvas;

}else if(options.scale && options.canvas !=null){

log("放大canvas",options.canvas);

var scale = options.scale || 1;

canvas = crop(renderer.canvas, {width: bounds.width * scale, height:bounds.height * scale, top: bounds.top *scale, left: bounds.left *scale, x: 0, y: 0});

}

else {

canvas = crop(renderer.canvas, {width: options.width != null ? options.width : bounds.width