cocosum 2020-03-05 09:47 采纳率: 33.3%
浏览 1716
已结题

html2canvas 截图出来的总有一点模糊

    var content = document.getElementById("content");
    var _width = $('#content').width(),
        _height = $('#content').height();

    var canvas = document.createElement("canvas");
    var scale = 5.5; //放大倍数
    canvas.width = _width * scale;
    canvas.height = _height * scale;
    canvas.getContext("2d").scale(scale, scale);

    html2canvas(content, {
        backgroundColor: '#FFFFFF',   //设置截图的背景色
        useCORS: true,                // 如果截图的内容里有图片,可能会有跨域的情况,加上这个参数,解决文件跨域问题
        allowTaint: true,             //允许跨域(图片跨域相关)
        taintTest: true,              //是否在渲染前测试图片
        scale: scale,
        canvas: canvas,
        width: _width,
        heigth: _height,
        dpi: window.devicePixelRatio * 96,
        onrendered: function(canvas) {
            var context = canvas.getContext('2d');
            // 【重要】关闭抗锯齿
            context.mozImageSmoothingEnabled = false;
            context.webkitImageSmoothingEnabled = false;
            context.msImageSmoothingEnabled = false;
            context.imageSmoothingEnabled = false;

            var dataUrl = canvas.toDataURL("image/png", 1.0),
                newImg = document.createElement("img");
            newImg.src = dataUrl;
            $('#pdf_png').empty().append(newImg);
            // newImg.style.width = '100%';

            // 方向默认竖直,尺寸ponits,格式a4[595.28,841.89]
            // var  pdf = new jsPDF('', 'mm', 'a4');
            // pdf.addImage(dataUrl, 'JPEG', 0, 0, 210, 297)
            // pdf.save(new Date().getTime() + '.pdf');

        }
    });

效果图:图片说明

哪位大佬者能推荐什么方法。
或者能远程帮忙代写,截取高分辨率图片,导出pdf能打印直接用的,有偿!
QQ 919900480

  • 写回答

1条回答 默认 最新

  • threenewbee 2020-03-05 09:58
    关注

    var scale = 5.5; //放大倍数
    放大倍数必须是2的指数(比如2 4 8 16),才能保证清晰

    评论

报告相同问题?

悬赏问题

  • ¥15 运筹学排序问题中的在线排序
  • ¥15 关于docker部署flink集成hadoop的yarn,请教个问题 flink启动yarn-session.sh连不上hadoop,这个整了好几天一直不行,求帮忙看一下怎么解决
  • ¥30 求一段fortran代码用IVF编译运行的结果
  • ¥15 深度学习根据CNN网络模型,搭建BP模型并训练MNIST数据集
  • ¥15 lammps拉伸应力应变曲线分析
  • ¥15 C++ 头文件/宏冲突问题解决
  • ¥15 用comsol模拟大气湍流通过底部加热(温度不同)的腔体
  • ¥50 安卓adb backup备份子用户应用数据失败
  • ¥20 有人能用聚类分析帮我分析一下文本内容嘛
  • ¥15 请问Lammps做复合材料拉伸模拟,应力应变曲线问题